<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>IconFont Demo</title>
  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=972185" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon andesign">&#xe77d;</span>
                <div class="name">check-circle</div>
                <div class="code-name">&amp;#xe77d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe77e;</span>
                <div class="name">CI</div>
                <div class="code-name">&amp;#xe77e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe77f;</span>
                <div class="name">Dollar</div>
                <div class="code-name">&amp;#xe77f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe780;</span>
                <div class="name">compass</div>
                <div class="code-name">&amp;#xe780;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe781;</span>
                <div class="name">close-circle</div>
                <div class="code-name">&amp;#xe781;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe782;</span>
                <div class="name">frown</div>
                <div class="code-name">&amp;#xe782;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe783;</span>
                <div class="name">info-circle</div>
                <div class="code-name">&amp;#xe783;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe784;</span>
                <div class="name">left-circle</div>
                <div class="code-name">&amp;#xe784;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe785;</span>
                <div class="name">down-circle</div>
                <div class="code-name">&amp;#xe785;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe786;</span>
                <div class="name">EURO</div>
                <div class="code-name">&amp;#xe786;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe787;</span>
                <div class="name">copyright</div>
                <div class="code-name">&amp;#xe787;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe788;</span>
                <div class="name">minus-circle</div>
                <div class="code-name">&amp;#xe788;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe789;</span>
                <div class="name">meh</div>
                <div class="code-name">&amp;#xe789;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe78a;</span>
                <div class="name">plus-circle</div>
                <div class="code-name">&amp;#xe78a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe78b;</span>
                <div class="name">play-circle</div>
                <div class="code-name">&amp;#xe78b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe78c;</span>
                <div class="name">question-circle</div>
                <div class="code-name">&amp;#xe78c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe78d;</span>
                <div class="name">Pound</div>
                <div class="code-name">&amp;#xe78d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe78e;</span>
                <div class="name">right-circle</div>
                <div class="code-name">&amp;#xe78e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe78f;</span>
                <div class="name">smile</div>
                <div class="code-name">&amp;#xe78f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe790;</span>
                <div class="name">trademark</div>
                <div class="code-name">&amp;#xe790;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe791;</span>
                <div class="name">time-circle</div>
                <div class="code-name">&amp;#xe791;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe792;</span>
                <div class="name">time out</div>
                <div class="code-name">&amp;#xe792;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe793;</span>
                <div class="name">earth</div>
                <div class="code-name">&amp;#xe793;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe794;</span>
                <div class="name">YUAN</div>
                <div class="code-name">&amp;#xe794;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe795;</span>
                <div class="name">up-circle</div>
                <div class="code-name">&amp;#xe795;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe796;</span>
                <div class="name">warning-circle</div>
                <div class="code-name">&amp;#xe796;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe797;</span>
                <div class="name">sync</div>
                <div class="code-name">&amp;#xe797;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe798;</span>
                <div class="name">transaction</div>
                <div class="code-name">&amp;#xe798;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe799;</span>
                <div class="name">undo</div>
                <div class="code-name">&amp;#xe799;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe79a;</span>
                <div class="name">redo</div>
                <div class="code-name">&amp;#xe79a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe79b;</span>
                <div class="name">reload</div>
                <div class="code-name">&amp;#xe79b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe79c;</span>
                <div class="name">reload time</div>
                <div class="code-name">&amp;#xe79c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe79d;</span>
                <div class="name">message</div>
                <div class="code-name">&amp;#xe79d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe79e;</span>
                <div class="name">dashboard</div>
                <div class="code-name">&amp;#xe79e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe79f;</span>
                <div class="name">issues close</div>
                <div class="code-name">&amp;#xe79f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a0;</span>
                <div class="name">poweroff</div>
                <div class="code-name">&amp;#xe7a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a1;</span>
                <div class="name">logout</div>
                <div class="code-name">&amp;#xe7a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a2;</span>
                <div class="name">pie chart</div>
                <div class="code-name">&amp;#xe7a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a3;</span>
                <div class="name">setting</div>
                <div class="code-name">&amp;#xe7a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a4;</span>
                <div class="name">eye</div>
                <div class="code-name">&amp;#xe7a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a5;</span>
                <div class="name">location</div>
                <div class="code-name">&amp;#xe7a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a6;</span>
                <div class="name">edit-square</div>
                <div class="code-name">&amp;#xe7a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a7;</span>
                <div class="name">export</div>
                <div class="code-name">&amp;#xe7a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a8;</span>
                <div class="name">save</div>
                <div class="code-name">&amp;#xe7a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7a9;</span>
                <div class="name">Import</div>
                <div class="code-name">&amp;#xe7a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7aa;</span>
                <div class="name">app store</div>
                <div class="code-name">&amp;#xe7aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ab;</span>
                <div class="name">close-square</div>
                <div class="code-name">&amp;#xe7ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ac;</span>
                <div class="name">down-square</div>
                <div class="code-name">&amp;#xe7ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ad;</span>
                <div class="name">layout</div>
                <div class="code-name">&amp;#xe7ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ae;</span>
                <div class="name">left-square</div>
                <div class="code-name">&amp;#xe7ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7af;</span>
                <div class="name">play-square</div>
                <div class="code-name">&amp;#xe7af;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b0;</span>
                <div class="name">control</div>
                <div class="code-name">&amp;#xe7b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b1;</span>
                <div class="name">code library</div>
                <div class="code-name">&amp;#xe7b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b2;</span>
                <div class="name">detail</div>
                <div class="code-name">&amp;#xe7b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b3;</span>
                <div class="name">minus-square</div>
                <div class="code-name">&amp;#xe7b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b4;</span>
                <div class="name">plus-square</div>
                <div class="code-name">&amp;#xe7b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b5;</span>
                <div class="name">right-square</div>
                <div class="code-name">&amp;#xe7b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b6;</span>
                <div class="name">project</div>
                <div class="code-name">&amp;#xe7b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b7;</span>
                <div class="name">wallet</div>
                <div class="code-name">&amp;#xe7b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b8;</span>
                <div class="name">up-square</div>
                <div class="code-name">&amp;#xe7b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7b9;</span>
                <div class="name">calculator</div>
                <div class="code-name">&amp;#xe7b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ba;</span>
                <div class="name">interation</div>
                <div class="code-name">&amp;#xe7ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7bb;</span>
                <div class="name">check-square</div>
                <div class="code-name">&amp;#xe7bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7bc;</span>
                <div class="name">border</div>
                <div class="code-name">&amp;#xe7bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7bd;</span>
                <div class="name">border-outer</div>
                <div class="code-name">&amp;#xe7bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7be;</span>
                <div class="name">border-top</div>
                <div class="code-name">&amp;#xe7be;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7bf;</span>
                <div class="name">border-bottom</div>
                <div class="code-name">&amp;#xe7bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c0;</span>
                <div class="name">border-left</div>
                <div class="code-name">&amp;#xe7c0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c1;</span>
                <div class="name">border-right</div>
                <div class="code-name">&amp;#xe7c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c2;</span>
                <div class="name">border-inner</div>
                <div class="code-name">&amp;#xe7c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c3;</span>
                <div class="name">border-verticle</div>
                <div class="code-name">&amp;#xe7c3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c4;</span>
                <div class="name">border-horizontal</div>
                <div class="code-name">&amp;#xe7c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c5;</span>
                <div class="name">radius-bottomleft</div>
                <div class="code-name">&amp;#xe7c5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c6;</span>
                <div class="name">radius-bottomright</div>
                <div class="code-name">&amp;#xe7c6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c7;</span>
                <div class="name">radius-upleft</div>
                <div class="code-name">&amp;#xe7c7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c8;</span>
                <div class="name">radius-upright</div>
                <div class="code-name">&amp;#xe7c8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7c9;</span>
                <div class="name">radius-setting</div>
                <div class="code-name">&amp;#xe7c9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ca;</span>
                <div class="name">add user</div>
                <div class="code-name">&amp;#xe7ca;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7cb;</span>
                <div class="name">delete team</div>
                <div class="code-name">&amp;#xe7cb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7cc;</span>
                <div class="name">delete user</div>
                <div class="code-name">&amp;#xe7cc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7cd;</span>
                <div class="name">addteam</div>
                <div class="code-name">&amp;#xe7cd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ce;</span>
                <div class="name">user</div>
                <div class="code-name">&amp;#xe7ce;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7cf;</span>
                <div class="name">team</div>
                <div class="code-name">&amp;#xe7cf;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d0;</span>
                <div class="name">area chart</div>
                <div class="code-name">&amp;#xe7d0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d1;</span>
                <div class="name">line chart</div>
                <div class="code-name">&amp;#xe7d1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d2;</span>
                <div class="name">bar chart</div>
                <div class="code-name">&amp;#xe7d2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d3;</span>
                <div class="name">point map</div>
                <div class="code-name">&amp;#xe7d3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d4;</span>
                <div class="name">container</div>
                <div class="code-name">&amp;#xe7d4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d5;</span>
                <div class="name">database</div>
                <div class="code-name">&amp;#xe7d5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d6;</span>
                <div class="name">sever</div>
                <div class="code-name">&amp;#xe7d6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d7;</span>
                <div class="name">mobile</div>
                <div class="code-name">&amp;#xe7d7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d8;</span>
                <div class="name">tablet</div>
                <div class="code-name">&amp;#xe7d8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7d9;</span>
                <div class="name">red envelope</div>
                <div class="code-name">&amp;#xe7d9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7da;</span>
                <div class="name">book</div>
                <div class="code-name">&amp;#xe7da;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7db;</span>
                <div class="name">file done</div>
                <div class="code-name">&amp;#xe7db;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7dc;</span>
                <div class="name">reconciliation</div>
                <div class="code-name">&amp;#xe7dc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7dd;</span>
                <div class="name">file -exception</div>
                <div class="code-name">&amp;#xe7dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7de;</span>
                <div class="name">file sync</div>
                <div class="code-name">&amp;#xe7de;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7df;</span>
                <div class="name">file search</div>
                <div class="code-name">&amp;#xe7df;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e0;</span>
                <div class="name">solution</div>
                <div class="code-name">&amp;#xe7e0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e1;</span>
                <div class="name">file protect</div>
                <div class="code-name">&amp;#xe7e1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e2;</span>
                <div class="name">file-add</div>
                <div class="code-name">&amp;#xe7e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e3;</span>
                <div class="name">file-excel</div>
                <div class="code-name">&amp;#xe7e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e4;</span>
                <div class="name">file-exclamation</div>
                <div class="code-name">&amp;#xe7e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e5;</span>
                <div class="name">file-pdf</div>
                <div class="code-name">&amp;#xe7e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e6;</span>
                <div class="name">file-image</div>
                <div class="code-name">&amp;#xe7e6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e7;</span>
                <div class="name">file-markdown</div>
                <div class="code-name">&amp;#xe7e7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e8;</span>
                <div class="name">file-unknown</div>
                <div class="code-name">&amp;#xe7e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7e9;</span>
                <div class="name">file-ppt</div>
                <div class="code-name">&amp;#xe7e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ea;</span>
                <div class="name">file-word</div>
                <div class="code-name">&amp;#xe7ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7eb;</span>
                <div class="name">file</div>
                <div class="code-name">&amp;#xe7eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ec;</span>
                <div class="name">file-zip</div>
                <div class="code-name">&amp;#xe7ec;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ed;</span>
                <div class="name">file-text</div>
                <div class="code-name">&amp;#xe7ed;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ee;</span>
                <div class="name">file-copy</div>
                <div class="code-name">&amp;#xe7ee;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ef;</span>
                <div class="name">snippets</div>
                <div class="code-name">&amp;#xe7ef;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f0;</span>
                <div class="name">audit</div>
                <div class="code-name">&amp;#xe7f0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f1;</span>
                <div class="name">diff</div>
                <div class="code-name">&amp;#xe7f1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f2;</span>
                <div class="name">Batch folding</div>
                <div class="code-name">&amp;#xe7f2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f3;</span>
                <div class="name">security scan</div>
                <div class="code-name">&amp;#xe7f3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f4;</span>
                <div class="name">property safety</div>
                <div class="code-name">&amp;#xe7f4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f5;</span>
                <div class="name">safety certificate</div>
                <div class="code-name">&amp;#xe7f5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f6;</span>
                <div class="name">insurance </div>
                <div class="code-name">&amp;#xe7f6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f7;</span>
                <div class="name">alert</div>
                <div class="code-name">&amp;#xe7f7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f8;</span>
                <div class="name">delete</div>
                <div class="code-name">&amp;#xe7f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7f9;</span>
                <div class="name">hourglass</div>
                <div class="code-name">&amp;#xe7f9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7fa;</span>
                <div class="name">bulb</div>
                <div class="code-name">&amp;#xe7fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7fb;</span>
                <div class="name">experiment</div>
                <div class="code-name">&amp;#xe7fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7fc;</span>
                <div class="name">bell</div>
                <div class="code-name">&amp;#xe7fc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7fd;</span>
                <div class="name">trophy</div>
                <div class="code-name">&amp;#xe7fd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7fe;</span>
                <div class="name">rest</div>
                <div class="code-name">&amp;#xe7fe;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe7ff;</span>
                <div class="name">USB</div>
                <div class="code-name">&amp;#xe7ff;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe800;</span>
                <div class="name">skin</div>
                <div class="code-name">&amp;#xe800;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe801;</span>
                <div class="name">home</div>
                <div class="code-name">&amp;#xe801;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe802;</span>
                <div class="name">bank</div>
                <div class="code-name">&amp;#xe802;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe803;</span>
                <div class="name">filter</div>
                <div class="code-name">&amp;#xe803;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe804;</span>
                <div class="name">funnel plot</div>
                <div class="code-name">&amp;#xe804;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe805;</span>
                <div class="name">like</div>
                <div class="code-name">&amp;#xe805;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe806;</span>
                <div class="name">unlike</div>
                <div class="code-name">&amp;#xe806;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe807;</span>
                <div class="name">unlock</div>
                <div class="code-name">&amp;#xe807;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe808;</span>
                <div class="name">lock</div>
                <div class="code-name">&amp;#xe808;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe809;</span>
                <div class="name">customerservice</div>
                <div class="code-name">&amp;#xe809;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe80a;</span>
                <div class="name">flag</div>
                <div class="code-name">&amp;#xe80a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe80b;</span>
                <div class="name">money collect</div>
                <div class="code-name">&amp;#xe80b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe80c;</span>
                <div class="name">medicinebox</div>
                <div class="code-name">&amp;#xe80c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe80d;</span>
                <div class="name">shop</div>
                <div class="code-name">&amp;#xe80d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe80e;</span>
                <div class="name">rocket</div>
                <div class="code-name">&amp;#xe80e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe80f;</span>
                <div class="name">shopping</div>
                <div class="code-name">&amp;#xe80f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe810;</span>
                <div class="name">folder</div>
                <div class="code-name">&amp;#xe810;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe811;</span>
                <div class="name">folder-open</div>
                <div class="code-name">&amp;#xe811;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe812;</span>
                <div class="name">folder-add</div>
                <div class="code-name">&amp;#xe812;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe813;</span>
                <div class="name">deployment unit</div>
                <div class="code-name">&amp;#xe813;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe814;</span>
                <div class="name">account book</div>
                <div class="code-name">&amp;#xe814;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe815;</span>
                <div class="name">contacts</div>
                <div class="code-name">&amp;#xe815;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe816;</span>
                <div class="name">carry out</div>
                <div class="code-name">&amp;#xe816;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe817;</span>
                <div class="name">calendar-check</div>
                <div class="code-name">&amp;#xe817;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe818;</span>
                <div class="name">calendar</div>
                <div class="code-name">&amp;#xe818;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe819;</span>
                <div class="name">scan</div>
                <div class="code-name">&amp;#xe819;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe81a;</span>
                <div class="name">select</div>
                <div class="code-name">&amp;#xe81a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe81b;</span>
                <div class="name">box plot</div>
                <div class="code-name">&amp;#xe81b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe81c;</span>
                <div class="name">build</div>
                <div class="code-name">&amp;#xe81c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe81d;</span>
                <div class="name">sliders</div>
                <div class="code-name">&amp;#xe81d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe81e;</span>
                <div class="name">laptop</div>
                <div class="code-name">&amp;#xe81e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe81f;</span>
                <div class="name">barcode</div>
                <div class="code-name">&amp;#xe81f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe820;</span>
                <div class="name">camera</div>
                <div class="code-name">&amp;#xe820;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe821;</span>
                <div class="name">cluster</div>
                <div class="code-name">&amp;#xe821;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe822;</span>
                <div class="name">gateway</div>
                <div class="code-name">&amp;#xe822;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe823;</span>
                <div class="name">car</div>
                <div class="code-name">&amp;#xe823;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe824;</span>
                <div class="name">printer</div>
                <div class="code-name">&amp;#xe824;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe825;</span>
                <div class="name">read</div>
                <div class="code-name">&amp;#xe825;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe826;</span>
                <div class="name">cloud-server</div>
                <div class="code-name">&amp;#xe826;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe827;</span>
                <div class="name">cloud-upload</div>
                <div class="code-name">&amp;#xe827;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe828;</span>
                <div class="name">cloud</div>
                <div class="code-name">&amp;#xe828;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe829;</span>
                <div class="name">cloud-download</div>
                <div class="code-name">&amp;#xe829;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe82a;</span>
                <div class="name">cloud-sync</div>
                <div class="code-name">&amp;#xe82a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe82b;</span>
                <div class="name">video</div>
                <div class="code-name">&amp;#xe82b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe82c;</span>
                <div class="name">notification</div>
                <div class="code-name">&amp;#xe82c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe82d;</span>
                <div class="name">sound</div>
                <div class="code-name">&amp;#xe82d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe82e;</span>
                <div class="name">radar chart</div>
                <div class="code-name">&amp;#xe82e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe82f;</span>
                <div class="name">qrcode</div>
                <div class="code-name">&amp;#xe82f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe830;</span>
                <div class="name">fund</div>
                <div class="code-name">&amp;#xe830;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe831;</span>
                <div class="name">image</div>
                <div class="code-name">&amp;#xe831;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe832;</span>
                <div class="name">mail</div>
                <div class="code-name">&amp;#xe832;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe833;</span>
                <div class="name">table</div>
                <div class="code-name">&amp;#xe833;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe834;</span>
                <div class="name">id card</div>
                <div class="code-name">&amp;#xe834;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe835;</span>
                <div class="name">credit card</div>
                <div class="code-name">&amp;#xe835;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe836;</span>
                <div class="name">heart</div>
                <div class="code-name">&amp;#xe836;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe837;</span>
                <div class="name">block</div>
                <div class="code-name">&amp;#xe837;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe838;</span>
                <div class="name">error</div>
                <div class="code-name">&amp;#xe838;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe839;</span>
                <div class="name">star</div>
                <div class="code-name">&amp;#xe839;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe83a;</span>
                <div class="name">gold</div>
                <div class="code-name">&amp;#xe83a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe83b;</span>
                <div class="name">heat map</div>
                <div class="code-name">&amp;#xe83b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe83c;</span>
                <div class="name">wifi</div>
                <div class="code-name">&amp;#xe83c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe83d;</span>
                <div class="name">attachment</div>
                <div class="code-name">&amp;#xe83d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe83e;</span>
                <div class="name">edit</div>
                <div class="code-name">&amp;#xe83e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe83f;</span>
                <div class="name">key</div>
                <div class="code-name">&amp;#xe83f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe840;</span>
                <div class="name">api</div>
                <div class="code-name">&amp;#xe840;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe841;</span>
                <div class="name">disconnect</div>
                <div class="code-name">&amp;#xe841;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe842;</span>
                <div class="name">highlight</div>
                <div class="code-name">&amp;#xe842;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe843;</span>
                <div class="name">monitor</div>
                <div class="code-name">&amp;#xe843;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe844;</span>
                <div class="name">link</div>
                <div class="code-name">&amp;#xe844;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe845;</span>
                <div class="name">man</div>
                <div class="code-name">&amp;#xe845;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe846;</span>
                <div class="name">percentage</div>
                <div class="code-name">&amp;#xe846;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe847;</span>
                <div class="name">pushpin</div>
                <div class="code-name">&amp;#xe847;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe848;</span>
                <div class="name">phone</div>
                <div class="code-name">&amp;#xe848;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe849;</span>
                <div class="name">shake</div>
                <div class="code-name">&amp;#xe849;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe84a;</span>
                <div class="name">tag</div>
                <div class="code-name">&amp;#xe84a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe84b;</span>
                <div class="name">wrench</div>
                <div class="code-name">&amp;#xe84b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe84c;</span>
                <div class="name">tags</div>
                <div class="code-name">&amp;#xe84c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe84d;</span>
                <div class="name">scissor</div>
                <div class="code-name">&amp;#xe84d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe84e;</span>
                <div class="name">mr</div>
                <div class="code-name">&amp;#xe84e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe84f;</span>
                <div class="name">share</div>
                <div class="code-name">&amp;#xe84f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe850;</span>
                <div class="name">branches</div>
                <div class="code-name">&amp;#xe850;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe851;</span>
                <div class="name">fork</div>
                <div class="code-name">&amp;#xe851;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe852;</span>
                <div class="name">shrink</div>
                <div class="code-name">&amp;#xe852;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe853;</span>
                <div class="name">arrawsalt</div>
                <div class="code-name">&amp;#xe853;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe854;</span>
                <div class="name">vertical right</div>
                <div class="code-name">&amp;#xe854;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe855;</span>
                <div class="name">vertical left</div>
                <div class="code-name">&amp;#xe855;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe856;</span>
                <div class="name">right</div>
                <div class="code-name">&amp;#xe856;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe857;</span>
                <div class="name">left</div>
                <div class="code-name">&amp;#xe857;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe858;</span>
                <div class="name">up</div>
                <div class="code-name">&amp;#xe858;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe859;</span>
                <div class="name">down</div>
                <div class="code-name">&amp;#xe859;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe85a;</span>
                <div class="name">fullscreen</div>
                <div class="code-name">&amp;#xe85a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe85b;</span>
                <div class="name">fullscreen-exit</div>
                <div class="code-name">&amp;#xe85b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe85c;</span>
                <div class="name">doubleleft</div>
                <div class="code-name">&amp;#xe85c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe85d;</span>
                <div class="name">double right</div>
                <div class="code-name">&amp;#xe85d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe85e;</span>
                <div class="name">arrowright</div>
                <div class="code-name">&amp;#xe85e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe85f;</span>
                <div class="name">arrowup</div>
                <div class="code-name">&amp;#xe85f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe860;</span>
                <div class="name">arrowleft</div>
                <div class="code-name">&amp;#xe860;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe861;</span>
                <div class="name">arrowdown</div>
                <div class="code-name">&amp;#xe861;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe862;</span>
                <div class="name">upload</div>
                <div class="code-name">&amp;#xe862;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe863;</span>
                <div class="name">colum-height</div>
                <div class="code-name">&amp;#xe863;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe864;</span>
                <div class="name">vertical-align-botto</div>
                <div class="code-name">&amp;#xe864;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe865;</span>
                <div class="name">vertical-align-middl</div>
                <div class="code-name">&amp;#xe865;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe866;</span>
                <div class="name">totop</div>
                <div class="code-name">&amp;#xe866;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe867;</span>
                <div class="name">vertical-align-top</div>
                <div class="code-name">&amp;#xe867;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe868;</span>
                <div class="name">download</div>
                <div class="code-name">&amp;#xe868;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe869;</span>
                <div class="name">sort-descending</div>
                <div class="code-name">&amp;#xe869;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe86a;</span>
                <div class="name">sort-ascending</div>
                <div class="code-name">&amp;#xe86a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe86b;</span>
                <div class="name">fall</div>
                <div class="code-name">&amp;#xe86b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe86c;</span>
                <div class="name">swap</div>
                <div class="code-name">&amp;#xe86c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe86d;</span>
                <div class="name">stock</div>
                <div class="code-name">&amp;#xe86d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe86e;</span>
                <div class="name">rise</div>
                <div class="code-name">&amp;#xe86e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe86f;</span>
                <div class="name">indent</div>
                <div class="code-name">&amp;#xe86f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe870;</span>
                <div class="name">outdent</div>
                <div class="code-name">&amp;#xe870;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe871;</span>
                <div class="name">menu</div>
                <div class="code-name">&amp;#xe871;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe872;</span>
                <div class="name">unordered list</div>
                <div class="code-name">&amp;#xe872;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe873;</span>
                <div class="name">ordered list</div>
                <div class="code-name">&amp;#xe873;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe874;</span>
                <div class="name">align-right</div>
                <div class="code-name">&amp;#xe874;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe875;</span>
                <div class="name">align-center</div>
                <div class="code-name">&amp;#xe875;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe876;</span>
                <div class="name">align-left</div>
                <div class="code-name">&amp;#xe876;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe877;</span>
                <div class="name">pic-center</div>
                <div class="code-name">&amp;#xe877;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe878;</span>
                <div class="name">pic-right</div>
                <div class="code-name">&amp;#xe878;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe879;</span>
                <div class="name">pic-left</div>
                <div class="code-name">&amp;#xe879;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe87a;</span>
                <div class="name">bold</div>
                <div class="code-name">&amp;#xe87a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe87b;</span>
                <div class="name">font-colors</div>
                <div class="code-name">&amp;#xe87b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe87c;</span>
                <div class="name">exclaimination</div>
                <div class="code-name">&amp;#xe87c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe87d;</span>
                <div class="name">font-size</div>
                <div class="code-name">&amp;#xe87d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe87e;</span>
                <div class="name">infomation</div>
                <div class="code-name">&amp;#xe87e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe87f;</span>
                <div class="name">line-height</div>
                <div class="code-name">&amp;#xe87f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe880;</span>
                <div class="name">strikethrough</div>
                <div class="code-name">&amp;#xe880;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe881;</span>
                <div class="name">underline</div>
                <div class="code-name">&amp;#xe881;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe882;</span>
                <div class="name">number</div>
                <div class="code-name">&amp;#xe882;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe883;</span>
                <div class="name">italic</div>
                <div class="code-name">&amp;#xe883;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe884;</span>
                <div class="name">code</div>
                <div class="code-name">&amp;#xe884;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe885;</span>
                <div class="name">column-width</div>
                <div class="code-name">&amp;#xe885;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe886;</span>
                <div class="name">check</div>
                <div class="code-name">&amp;#xe886;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe887;</span>
                <div class="name">ellipsis</div>
                <div class="code-name">&amp;#xe887;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe888;</span>
                <div class="name">dash</div>
                <div class="code-name">&amp;#xe888;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe889;</span>
                <div class="name">close</div>
                <div class="code-name">&amp;#xe889;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe88a;</span>
                <div class="name">enter</div>
                <div class="code-name">&amp;#xe88a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe88b;</span>
                <div class="name">line</div>
                <div class="code-name">&amp;#xe88b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe88c;</span>
                <div class="name">minus</div>
                <div class="code-name">&amp;#xe88c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe88d;</span>
                <div class="name">question</div>
                <div class="code-name">&amp;#xe88d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe88e;</span>
                <div class="name">plus</div>
                <div class="code-name">&amp;#xe88e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe88f;</span>
                <div class="name">rollback</div>
                <div class="code-name">&amp;#xe88f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe890;</span>
                <div class="name">small-dash</div>
                <div class="code-name">&amp;#xe890;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe891;</span>
                <div class="name">pause</div>
                <div class="code-name">&amp;#xe891;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe892;</span>
                <div class="name">bg-colors</div>
                <div class="code-name">&amp;#xe892;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe893;</span>
                <div class="name">crown</div>
                <div class="code-name">&amp;#xe893;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe894;</span>
                <div class="name">drag</div>
                <div class="code-name">&amp;#xe894;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe895;</span>
                <div class="name">desktop</div>
                <div class="code-name">&amp;#xe895;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe896;</span>
                <div class="name">gift</div>
                <div class="code-name">&amp;#xe896;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe897;</span>
                <div class="name">stop</div>
                <div class="code-name">&amp;#xe897;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe898;</span>
                <div class="name">fire</div>
                <div class="code-name">&amp;#xe898;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe899;</span>
                <div class="name">thunderbolt</div>
                <div class="code-name">&amp;#xe899;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe89a;</span>
                <div class="name">check-circle-fill</div>
                <div class="code-name">&amp;#xe89a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe89b;</span>
                <div class="name">left-circle-fill</div>
                <div class="code-name">&amp;#xe89b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe89c;</span>
                <div class="name">down-circle-fill</div>
                <div class="code-name">&amp;#xe89c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe89d;</span>
                <div class="name">minus-circle-fill</div>
                <div class="code-name">&amp;#xe89d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe89e;</span>
                <div class="name">close-circle-fill</div>
                <div class="code-name">&amp;#xe89e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe89f;</span>
                <div class="name">info-circle-fill</div>
                <div class="code-name">&amp;#xe89f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a0;</span>
                <div class="name">up-circle-fill</div>
                <div class="code-name">&amp;#xe8a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a1;</span>
                <div class="name">right-circle-fill</div>
                <div class="code-name">&amp;#xe8a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a2;</span>
                <div class="name">plus-circle-fill</div>
                <div class="code-name">&amp;#xe8a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a3;</span>
                <div class="name">question-circle-fill</div>
                <div class="code-name">&amp;#xe8a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a4;</span>
                <div class="name">EURO-circle-fill</div>
                <div class="code-name">&amp;#xe8a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a5;</span>
                <div class="name">frown-fill</div>
                <div class="code-name">&amp;#xe8a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a6;</span>
                <div class="name">copyright-circle-fil</div>
                <div class="code-name">&amp;#xe8a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a7;</span>
                <div class="name">CI-circle-fill</div>
                <div class="code-name">&amp;#xe8a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a8;</span>
                <div class="name">compass-fill</div>
                <div class="code-name">&amp;#xe8a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8a9;</span>
                <div class="name">Dollar-circle-fill</div>
                <div class="code-name">&amp;#xe8a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8aa;</span>
                <div class="name">poweroff-circle-fill</div>
                <div class="code-name">&amp;#xe8aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ab;</span>
                <div class="name">meh-fill</div>
                <div class="code-name">&amp;#xe8ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ac;</span>
                <div class="name">play-circle-fill</div>
                <div class="code-name">&amp;#xe8ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ad;</span>
                <div class="name">Pound-circle-fill</div>
                <div class="code-name">&amp;#xe8ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ae;</span>
                <div class="name">smile-fill</div>
                <div class="code-name">&amp;#xe8ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8af;</span>
                <div class="name">stop-fill</div>
                <div class="code-name">&amp;#xe8af;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b0;</span>
                <div class="name">warning-circle-fill</div>
                <div class="code-name">&amp;#xe8b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b1;</span>
                <div class="name">time-circle-fill</div>
                <div class="code-name">&amp;#xe8b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b2;</span>
                <div class="name">trademark-circle-fil</div>
                <div class="code-name">&amp;#xe8b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b3;</span>
                <div class="name">YUAN-circle-fill</div>
                <div class="code-name">&amp;#xe8b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b4;</span>
                <div class="name">heart-fill</div>
                <div class="code-name">&amp;#xe8b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b5;</span>
                <div class="name">pie chart-circle-fil</div>
                <div class="code-name">&amp;#xe8b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b6;</span>
                <div class="name">dashboard-fill</div>
                <div class="code-name">&amp;#xe8b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b7;</span>
                <div class="name">message-fill</div>
                <div class="code-name">&amp;#xe8b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b8;</span>
                <div class="name">check-square-fill</div>
                <div class="code-name">&amp;#xe8b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8b9;</span>
                <div class="name">down-square-fill</div>
                <div class="code-name">&amp;#xe8b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ba;</span>
                <div class="name">minus-square-fill</div>
                <div class="code-name">&amp;#xe8ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8bb;</span>
                <div class="name">close-square-fill</div>
                <div class="code-name">&amp;#xe8bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8bc;</span>
                <div class="name">code library-fill</div>
                <div class="code-name">&amp;#xe8bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8bd;</span>
                <div class="name">left-square-fill</div>
                <div class="code-name">&amp;#xe8bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8be;</span>
                <div class="name">play-square-fill</div>
                <div class="code-name">&amp;#xe8be;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8bf;</span>
                <div class="name">up-square-fill</div>
                <div class="code-name">&amp;#xe8bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c0;</span>
                <div class="name">right-square-fill</div>
                <div class="code-name">&amp;#xe8c0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c1;</span>
                <div class="name">plus-square-fill</div>
                <div class="code-name">&amp;#xe8c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c2;</span>
                <div class="name">account book-fill</div>
                <div class="code-name">&amp;#xe8c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c3;</span>
                <div class="name">carry out-fill</div>
                <div class="code-name">&amp;#xe8c3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c4;</span>
                <div class="name">calendar-fill</div>
                <div class="code-name">&amp;#xe8c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c5;</span>
                <div class="name">calculator-fill</div>
                <div class="code-name">&amp;#xe8c5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c6;</span>
                <div class="name">interation-fill</div>
                <div class="code-name">&amp;#xe8c6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c7;</span>
                <div class="name">project-fill</div>
                <div class="code-name">&amp;#xe8c7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c8;</span>
                <div class="name">detail-fill</div>
                <div class="code-name">&amp;#xe8c8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8c9;</span>
                <div class="name">save-fill</div>
                <div class="code-name">&amp;#xe8c9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ca;</span>
                <div class="name">wallet-fill</div>
                <div class="code-name">&amp;#xe8ca;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8cb;</span>
                <div class="name">control-fill</div>
                <div class="code-name">&amp;#xe8cb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8cc;</span>
                <div class="name">layout-fill</div>
                <div class="code-name">&amp;#xe8cc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8cd;</span>
                <div class="name">app store-fill</div>
                <div class="code-name">&amp;#xe8cd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ce;</span>
                <div class="name">mobile-fill</div>
                <div class="code-name">&amp;#xe8ce;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8cf;</span>
                <div class="name">tablet-fill</div>
                <div class="code-name">&amp;#xe8cf;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d0;</span>
                <div class="name">book-fill</div>
                <div class="code-name">&amp;#xe8d0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d1;</span>
                <div class="name">red envelope-fill</div>
                <div class="code-name">&amp;#xe8d1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d2;</span>
                <div class="name">safety certificate-f</div>
                <div class="code-name">&amp;#xe8d2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d3;</span>
                <div class="name">property safety-fill</div>
                <div class="code-name">&amp;#xe8d3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d4;</span>
                <div class="name">insurance-fill</div>
                <div class="code-name">&amp;#xe8d4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d5;</span>
                <div class="name">security scan-fill</div>
                <div class="code-name">&amp;#xe8d5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d6;</span>
                <div class="name">file-exclamation-fil</div>
                <div class="code-name">&amp;#xe8d6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d7;</span>
                <div class="name">file-add-fill</div>
                <div class="code-name">&amp;#xe8d7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d8;</span>
                <div class="name">file-fill</div>
                <div class="code-name">&amp;#xe8d8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8d9;</span>
                <div class="name">file-excel-fill</div>
                <div class="code-name">&amp;#xe8d9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8da;</span>
                <div class="name">file-markdown-fill</div>
                <div class="code-name">&amp;#xe8da;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8db;</span>
                <div class="name">file-text-fill</div>
                <div class="code-name">&amp;#xe8db;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8dc;</span>
                <div class="name">file-ppt-fill</div>
                <div class="code-name">&amp;#xe8dc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8dd;</span>
                <div class="name">file-unknown-fill</div>
                <div class="code-name">&amp;#xe8dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8de;</span>
                <div class="name">file-word-fill</div>
                <div class="code-name">&amp;#xe8de;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8df;</span>
                <div class="name">file-zip-fill</div>
                <div class="code-name">&amp;#xe8df;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e0;</span>
                <div class="name">file-pdf-fill</div>
                <div class="code-name">&amp;#xe8e0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e1;</span>
                <div class="name">file-image-fill</div>
                <div class="code-name">&amp;#xe8e1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e2;</span>
                <div class="name">diff-fill</div>
                <div class="code-name">&amp;#xe8e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e3;</span>
                <div class="name">file-copy-fill</div>
                <div class="code-name">&amp;#xe8e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e4;</span>
                <div class="name">snippets-fill</div>
                <div class="code-name">&amp;#xe8e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e5;</span>
                <div class="name">batch folding-fill</div>
                <div class="code-name">&amp;#xe8e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e6;</span>
                <div class="name">reconciliation-fill</div>
                <div class="code-name">&amp;#xe8e6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e7;</span>
                <div class="name">folder-add-fill</div>
                <div class="code-name">&amp;#xe8e7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e8;</span>
                <div class="name">folder-fill</div>
                <div class="code-name">&amp;#xe8e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8e9;</span>
                <div class="name">folder-open-fill</div>
                <div class="code-name">&amp;#xe8e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ea;</span>
                <div class="name">database-fill</div>
                <div class="code-name">&amp;#xe8ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8eb;</span>
                <div class="name">container-fill</div>
                <div class="code-name">&amp;#xe8eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ec;</span>
                <div class="name">sever-fill</div>
                <div class="code-name">&amp;#xe8ec;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ed;</span>
                <div class="name">calendar-check-fill</div>
                <div class="code-name">&amp;#xe8ed;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ee;</span>
                <div class="name">image-fill</div>
                <div class="code-name">&amp;#xe8ee;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ef;</span>
                <div class="name">id card-fill</div>
                <div class="code-name">&amp;#xe8ef;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f0;</span>
                <div class="name">credit card-fill</div>
                <div class="code-name">&amp;#xe8f0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f1;</span>
                <div class="name">fund-fill</div>
                <div class="code-name">&amp;#xe8f1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f2;</span>
                <div class="name">read-fill</div>
                <div class="code-name">&amp;#xe8f2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f3;</span>
                <div class="name">contacts-fill</div>
                <div class="code-name">&amp;#xe8f3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f4;</span>
                <div class="name">delete-fill</div>
                <div class="code-name">&amp;#xe8f4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f5;</span>
                <div class="name">notification-fill</div>
                <div class="code-name">&amp;#xe8f5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f6;</span>
                <div class="name">flag-fill</div>
                <div class="code-name">&amp;#xe8f6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f7;</span>
                <div class="name">money collect-fill</div>
                <div class="code-name">&amp;#xe8f7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f8;</span>
                <div class="name">medicine box-fill</div>
                <div class="code-name">&amp;#xe8f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8f9;</span>
                <div class="name">rest-fill</div>
                <div class="code-name">&amp;#xe8f9;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8fa;</span>
                <div class="name">shopping-fill</div>
                <div class="code-name">&amp;#xe8fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8fb;</span>
                <div class="name">skin-fill</div>
                <div class="code-name">&amp;#xe8fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8fc;</span>
                <div class="name">video-fill</div>
                <div class="code-name">&amp;#xe8fc;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8fd;</span>
                <div class="name">sound-fill</div>
                <div class="code-name">&amp;#xe8fd;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8fe;</span>
                <div class="name">bulb-fill</div>
                <div class="code-name">&amp;#xe8fe;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe8ff;</span>
                <div class="name">bell-fill</div>
                <div class="code-name">&amp;#xe8ff;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe900;</span>
                <div class="name">filter-fill</div>
                <div class="code-name">&amp;#xe900;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe901;</span>
                <div class="name">fire-fill</div>
                <div class="code-name">&amp;#xe901;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe902;</span>
                <div class="name">funnel plot-fill</div>
                <div class="code-name">&amp;#xe902;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe903;</span>
                <div class="name">gift-fill</div>
                <div class="code-name">&amp;#xe903;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe904;</span>
                <div class="name">hourglass-fill</div>
                <div class="code-name">&amp;#xe904;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe905;</span>
                <div class="name">home-fill</div>
                <div class="code-name">&amp;#xe905;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe906;</span>
                <div class="name">trophy-fill</div>
                <div class="code-name">&amp;#xe906;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe907;</span>
                <div class="name">location-fill</div>
                <div class="code-name">&amp;#xe907;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe908;</span>
                <div class="name">cloud-fill</div>
                <div class="code-name">&amp;#xe908;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe909;</span>
                <div class="name">customerservice-fill</div>
                <div class="code-name">&amp;#xe909;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe90a;</span>
                <div class="name">experiment-fill</div>
                <div class="code-name">&amp;#xe90a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe90b;</span>
                <div class="name">eye-fill</div>
                <div class="code-name">&amp;#xe90b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe90c;</span>
                <div class="name">like-fill</div>
                <div class="code-name">&amp;#xe90c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe90d;</span>
                <div class="name">lock-fill</div>
                <div class="code-name">&amp;#xe90d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe90e;</span>
                <div class="name">unlike-fill</div>
                <div class="code-name">&amp;#xe90e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe90f;</span>
                <div class="name">star-fill</div>
                <div class="code-name">&amp;#xe90f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe910;</span>
                <div class="name">unlock-fill</div>
                <div class="code-name">&amp;#xe910;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe911;</span>
                <div class="name">alert-fill</div>
                <div class="code-name">&amp;#xe911;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe912;</span>
                <div class="name">api-fill</div>
                <div class="code-name">&amp;#xe912;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe913;</span>
                <div class="name">highlight-fill</div>
                <div class="code-name">&amp;#xe913;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe914;</span>
                <div class="name">phone-fill</div>
                <div class="code-name">&amp;#xe914;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe915;</span>
                <div class="name">edit-fill</div>
                <div class="code-name">&amp;#xe915;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe916;</span>
                <div class="name">pushpin-fill</div>
                <div class="code-name">&amp;#xe916;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe917;</span>
                <div class="name">rocket-fill</div>
                <div class="code-name">&amp;#xe917;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe918;</span>
                <div class="name">thunderbolt-fill</div>
                <div class="code-name">&amp;#xe918;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe919;</span>
                <div class="name">tag-fill</div>
                <div class="code-name">&amp;#xe919;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe91a;</span>
                <div class="name">wrench-fill</div>
                <div class="code-name">&amp;#xe91a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe91b;</span>
                <div class="name">tags-fill</div>
                <div class="code-name">&amp;#xe91b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe91c;</span>
                <div class="name">bank-fill</div>
                <div class="code-name">&amp;#xe91c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe91d;</span>
                <div class="name">camera-fill</div>
                <div class="code-name">&amp;#xe91d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe91e;</span>
                <div class="name">error-fill</div>
                <div class="code-name">&amp;#xe91e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe91f;</span>
                <div class="name">crown-fill</div>
                <div class="code-name">&amp;#xe91f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe920;</span>
                <div class="name">mail-fill</div>
                <div class="code-name">&amp;#xe920;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe921;</span>
                <div class="name">car-fill</div>
                <div class="code-name">&amp;#xe921;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe922;</span>
                <div class="name">printer-fill</div>
                <div class="code-name">&amp;#xe922;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe923;</span>
                <div class="name">shop-fill</div>
                <div class="code-name">&amp;#xe923;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe924;</span>
                <div class="name">setting-fill</div>
                <div class="code-name">&amp;#xe924;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe925;</span>
                <div class="name">USB-fill</div>
                <div class="code-name">&amp;#xe925;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe926;</span>
                <div class="name">golden-fill</div>
                <div class="code-name">&amp;#xe926;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe927;</span>
                <div class="name">build-fill</div>
                <div class="code-name">&amp;#xe927;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe928;</span>
                <div class="name">box plot-fill</div>
                <div class="code-name">&amp;#xe928;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe929;</span>
                <div class="name">sliders-fill</div>
                <div class="code-name">&amp;#xe929;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe92a;</span>
                <div class="name">alibaba</div>
                <div class="code-name">&amp;#xe92a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe92b;</span>
                <div class="name">alibabacloud</div>
                <div class="code-name">&amp;#xe92b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe92c;</span>
                <div class="name">ant design</div>
                <div class="code-name">&amp;#xe92c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe92d;</span>
                <div class="name">ant-cloud</div>
                <div class="code-name">&amp;#xe92d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe92e;</span>
                <div class="name">behance</div>
                <div class="code-name">&amp;#xe92e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe92f;</span>
                <div class="name">google plus</div>
                <div class="code-name">&amp;#xe92f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe930;</span>
                <div class="name">medium</div>
                <div class="code-name">&amp;#xe930;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe931;</span>
                <div class="name">google</div>
                <div class="code-name">&amp;#xe931;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe932;</span>
                <div class="name">IE</div>
                <div class="code-name">&amp;#xe932;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe933;</span>
                <div class="name">amazon</div>
                <div class="code-name">&amp;#xe933;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe934;</span>
                <div class="name">slack</div>
                <div class="code-name">&amp;#xe934;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe935;</span>
                <div class="name">alipay</div>
                <div class="code-name">&amp;#xe935;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe936;</span>
                <div class="name">taobao</div>
                <div class="code-name">&amp;#xe936;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe937;</span>
                <div class="name">zhihu</div>
                <div class="code-name">&amp;#xe937;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe938;</span>
                <div class="name">HTML5</div>
                <div class="code-name">&amp;#xe938;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe939;</span>
                <div class="name">linkedin</div>
                <div class="code-name">&amp;#xe939;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe93a;</span>
                <div class="name">yahoo</div>
                <div class="code-name">&amp;#xe93a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe93b;</span>
                <div class="name">facebook</div>
                <div class="code-name">&amp;#xe93b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe93c;</span>
                <div class="name">skype</div>
                <div class="code-name">&amp;#xe93c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe93d;</span>
                <div class="name">CodeSandbox</div>
                <div class="code-name">&amp;#xe93d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe93e;</span>
                <div class="name">chrome</div>
                <div class="code-name">&amp;#xe93e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe93f;</span>
                <div class="name">codepen</div>
                <div class="code-name">&amp;#xe93f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe940;</span>
                <div class="name">aliwangwang</div>
                <div class="code-name">&amp;#xe940;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe941;</span>
                <div class="name">apple</div>
                <div class="code-name">&amp;#xe941;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe942;</span>
                <div class="name">android</div>
                <div class="code-name">&amp;#xe942;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe943;</span>
                <div class="name">sketch</div>
                <div class="code-name">&amp;#xe943;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe944;</span>
                <div class="name">Gitlab</div>
                <div class="code-name">&amp;#xe944;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe945;</span>
                <div class="name">dribbble</div>
                <div class="code-name">&amp;#xe945;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe946;</span>
                <div class="name">instagram</div>
                <div class="code-name">&amp;#xe946;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe947;</span>
                <div class="name">reddit</div>
                <div class="code-name">&amp;#xe947;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe948;</span>
                <div class="name">windows</div>
                <div class="code-name">&amp;#xe948;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe949;</span>
                <div class="name">yuque</div>
                <div class="code-name">&amp;#xe949;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe94a;</span>
                <div class="name">Youtube</div>
                <div class="code-name">&amp;#xe94a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe94b;</span>
                <div class="name">Gitlab-fill</div>
                <div class="code-name">&amp;#xe94b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe94c;</span>
                <div class="name">dropbox</div>
                <div class="code-name">&amp;#xe94c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe94d;</span>
                <div class="name">dingtalk</div>
                <div class="code-name">&amp;#xe94d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe94e;</span>
                <div class="name">android-fill</div>
                <div class="code-name">&amp;#xe94e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe94f;</span>
                <div class="name">apple-fill</div>
                <div class="code-name">&amp;#xe94f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe950;</span>
                <div class="name">HTML5-fill</div>
                <div class="code-name">&amp;#xe950;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe951;</span>
                <div class="name">windows-fill</div>
                <div class="code-name">&amp;#xe951;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe952;</span>
                <div class="name">QQ</div>
                <div class="code-name">&amp;#xe952;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe953;</span>
                <div class="name">twitter</div>
                <div class="code-name">&amp;#xe953;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe954;</span>
                <div class="name">skype-fill</div>
                <div class="code-name">&amp;#xe954;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe955;</span>
                <div class="name">weibo</div>
                <div class="code-name">&amp;#xe955;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe956;</span>
                <div class="name">yuque-fill</div>
                <div class="code-name">&amp;#xe956;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe957;</span>
                <div class="name">Youtube-fill</div>
                <div class="code-name">&amp;#xe957;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe958;</span>
                <div class="name">yahoo-fill</div>
                <div class="code-name">&amp;#xe958;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe959;</span>
                <div class="name">wechat-fill</div>
                <div class="code-name">&amp;#xe959;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe95a;</span>
                <div class="name">chrome-fill</div>
                <div class="code-name">&amp;#xe95a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe95b;</span>
                <div class="name">alipay-circle-fill</div>
                <div class="code-name">&amp;#xe95b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe95c;</span>
                <div class="name">aliwangwang-fill</div>
                <div class="code-name">&amp;#xe95c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe95d;</span>
                <div class="name">behance-circle-fill</div>
                <div class="code-name">&amp;#xe95d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe95e;</span>
                <div class="name">amazon-circle-fill</div>
                <div class="code-name">&amp;#xe95e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe95f;</span>
                <div class="name">codepen-circle-fill</div>
                <div class="code-name">&amp;#xe95f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe960;</span>
                <div class="name">CodeSandbox-circle-f</div>
                <div class="code-name">&amp;#xe960;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe961;</span>
                <div class="name">dropbox-circle-fill</div>
                <div class="code-name">&amp;#xe961;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe962;</span>
                <div class="name">github-fill</div>
                <div class="code-name">&amp;#xe962;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe963;</span>
                <div class="name">dribbble-circle-fill</div>
                <div class="code-name">&amp;#xe963;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe964;</span>
                <div class="name">google plus-circle-f</div>
                <div class="code-name">&amp;#xe964;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe965;</span>
                <div class="name">medium-circle-fill</div>
                <div class="code-name">&amp;#xe965;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe966;</span>
                <div class="name">QQ-circle-fill</div>
                <div class="code-name">&amp;#xe966;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe967;</span>
                <div class="name">IE-circle-fill</div>
                <div class="code-name">&amp;#xe967;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe968;</span>
                <div class="name">google-circle-fill</div>
                <div class="code-name">&amp;#xe968;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe969;</span>
                <div class="name">dingtalk-circle-fill</div>
                <div class="code-name">&amp;#xe969;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe96a;</span>
                <div class="name">sketch-circle-fill</div>
                <div class="code-name">&amp;#xe96a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe96b;</span>
                <div class="name">slack-circle-fill</div>
                <div class="code-name">&amp;#xe96b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe96c;</span>
                <div class="name">twitter-circle-fill</div>
                <div class="code-name">&amp;#xe96c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe96d;</span>
                <div class="name">taobao-circle-fill</div>
                <div class="code-name">&amp;#xe96d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe96e;</span>
                <div class="name">weibo-circle-fill</div>
                <div class="code-name">&amp;#xe96e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe96f;</span>
                <div class="name">zhihu-circle-fill</div>
                <div class="code-name">&amp;#xe96f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe970;</span>
                <div class="name">reddit-circle-fill</div>
                <div class="code-name">&amp;#xe970;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe971;</span>
                <div class="name">alipay-square-fill</div>
                <div class="code-name">&amp;#xe971;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe972;</span>
                <div class="name">dingtalk-square-fill</div>
                <div class="code-name">&amp;#xe972;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe973;</span>
                <div class="name">CodeSandbox-square-f</div>
                <div class="code-name">&amp;#xe973;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe974;</span>
                <div class="name">behance-square-fill</div>
                <div class="code-name">&amp;#xe974;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe975;</span>
                <div class="name">amazon-square-fill</div>
                <div class="code-name">&amp;#xe975;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe976;</span>
                <div class="name">codepen-square-fill</div>
                <div class="code-name">&amp;#xe976;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe977;</span>
                <div class="name">dribbble-square-fill</div>
                <div class="code-name">&amp;#xe977;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe978;</span>
                <div class="name">dropbox-square-fill</div>
                <div class="code-name">&amp;#xe978;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe979;</span>
                <div class="name">facebook-fill</div>
                <div class="code-name">&amp;#xe979;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe97a;</span>
                <div class="name">google plus-square-f</div>
                <div class="code-name">&amp;#xe97a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe97b;</span>
                <div class="name">google-square-fill</div>
                <div class="code-name">&amp;#xe97b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe97c;</span>
                <div class="name">instagram-fill</div>
                <div class="code-name">&amp;#xe97c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe97d;</span>
                <div class="name">IE-square-fill</div>
                <div class="code-name">&amp;#xe97d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe97e;</span>
                <div class="name">medium-square-fill</div>
                <div class="code-name">&amp;#xe97e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe97f;</span>
                <div class="name">linkedin-fill</div>
                <div class="code-name">&amp;#xe97f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe980;</span>
                <div class="name">QQ-square-fill</div>
                <div class="code-name">&amp;#xe980;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe981;</span>
                <div class="name">reddit-square-fill</div>
                <div class="code-name">&amp;#xe981;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe982;</span>
                <div class="name">twitter-square-fill</div>
                <div class="code-name">&amp;#xe982;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe983;</span>
                <div class="name">sketch-square-fill</div>
                <div class="code-name">&amp;#xe983;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe984;</span>
                <div class="name">slack-square-fill</div>
                <div class="code-name">&amp;#xe984;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe985;</span>
                <div class="name">taobao-square-fill</div>
                <div class="code-name">&amp;#xe985;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe986;</span>
                <div class="name">weibo-square-fill</div>
                <div class="code-name">&amp;#xe986;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe987;</span>
                <div class="name">zhihu-square-fill</div>
                <div class="code-name">&amp;#xe987;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe988;</span>
                <div class="name">zoom out</div>
                <div class="code-name">&amp;#xe988;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe989;</span>
                <div class="name">apartment</div>
                <div class="code-name">&amp;#xe989;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe98a;</span>
                <div class="name">audio</div>
                <div class="code-name">&amp;#xe98a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe98b;</span>
                <div class="name">audio-fill</div>
                <div class="code-name">&amp;#xe98b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe98c;</span>
                <div class="name">robot</div>
                <div class="code-name">&amp;#xe98c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe98d;</span>
                <div class="name">zoom in</div>
                <div class="code-name">&amp;#xe98d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe98e;</span>
                <div class="name">robot-fill</div>
                <div class="code-name">&amp;#xe98e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe98f;</span>
                <div class="name">bug-fill</div>
                <div class="code-name">&amp;#xe98f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe990;</span>
                <div class="name">bug</div>
                <div class="code-name">&amp;#xe990;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe991;</span>
                <div class="name">audio static</div>
                <div class="code-name">&amp;#xe991;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe992;</span>
                <div class="name">comment</div>
                <div class="code-name">&amp;#xe992;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe993;</span>
                <div class="name">signal-fill</div>
                <div class="code-name">&amp;#xe993;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe994;</span>
                <div class="name">verified</div>
                <div class="code-name">&amp;#xe994;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe995;</span>
                <div class="name">shortcut-fill</div>
                <div class="code-name">&amp;#xe995;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe996;</span>
                <div class="name">videocamera add</div>
                <div class="code-name">&amp;#xe996;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe997;</span>
                <div class="name">switch user</div>
                <div class="code-name">&amp;#xe997;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe998;</span>
                <div class="name">whatsapp</div>
                <div class="code-name">&amp;#xe998;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe999;</span>
                <div class="name">appstore add</div>
                <div class="code-name">&amp;#xe999;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe99a;</span>
                <div class="name">caret-down</div>
                <div class="code-name">&amp;#xe99a;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe99b;</span>
                <div class="name">backward</div>
                <div class="code-name">&amp;#xe99b;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe99c;</span>
                <div class="name">caret-up</div>
                <div class="code-name">&amp;#xe99c;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe99d;</span>
                <div class="name">caret-right</div>
                <div class="code-name">&amp;#xe99d;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe99e;</span>
                <div class="name">caret-left</div>
                <div class="code-name">&amp;#xe99e;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe99f;</span>
                <div class="name">fast-backward</div>
                <div class="code-name">&amp;#xe99f;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a0;</span>
                <div class="name">forward</div>
                <div class="code-name">&amp;#xe9a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a1;</span>
                <div class="name">fast-forward</div>
                <div class="code-name">&amp;#xe9a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a2;</span>
                <div class="name">search</div>
                <div class="code-name">&amp;#xe9a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a3;</span>
                <div class="name">retweet</div>
                <div class="code-name">&amp;#xe9a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a4;</span>
                <div class="name">login</div>
                <div class="code-name">&amp;#xe9a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a5;</span>
                <div class="name">step-backward</div>
                <div class="code-name">&amp;#xe9a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a6;</span>
                <div class="name">step-forward</div>
                <div class="code-name">&amp;#xe9a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a7;</span>
                <div class="name">swap-right</div>
                <div class="code-name">&amp;#xe9a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a8;</span>
                <div class="name">swap-left</div>
                <div class="code-name">&amp;#xe9a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon andesign">&#xe9a9;</span>
                <div class="name">woman</div>
                <div class="code-name">&amp;#xe9a9;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'andesign';
  src: url('iconfont.eot');
  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
      url('iconfont.woff2') format('woff2'),
      url('iconfont.woff') format('woff'),
      url('iconfont.ttf') format('truetype'),
      url('iconfont.svg#andesign') format('svg');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.andesign {
  font-family: "andesign" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="andesign"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"andesign" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon andesign icon-check-circle"></span>
            <div class="name">
              check-circle
            </div>
            <div class="code-name">.icon-check-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-CI"></span>
            <div class="name">
              CI
            </div>
            <div class="code-name">.icon-CI
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Dollar"></span>
            <div class="name">
              Dollar
            </div>
            <div class="code-name">.icon-Dollar
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-compass"></span>
            <div class="name">
              compass
            </div>
            <div class="code-name">.icon-compass
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-close-circle"></span>
            <div class="name">
              close-circle
            </div>
            <div class="code-name">.icon-close-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-frown"></span>
            <div class="name">
              frown
            </div>
            <div class="code-name">.icon-frown
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-info-circle"></span>
            <div class="name">
              info-circle
            </div>
            <div class="code-name">.icon-info-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-left-circle"></span>
            <div class="name">
              left-circle
            </div>
            <div class="code-name">.icon-left-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-down-circle"></span>
            <div class="name">
              down-circle
            </div>
            <div class="code-name">.icon-down-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-EURO"></span>
            <div class="name">
              EURO
            </div>
            <div class="code-name">.icon-EURO
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-copyright"></span>
            <div class="name">
              copyright
            </div>
            <div class="code-name">.icon-copyright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-minus-circle"></span>
            <div class="name">
              minus-circle
            </div>
            <div class="code-name">.icon-minus-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-meh"></span>
            <div class="name">
              meh
            </div>
            <div class="code-name">.icon-meh
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-plus-circle"></span>
            <div class="name">
              plus-circle
            </div>
            <div class="code-name">.icon-plus-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-play-circle"></span>
            <div class="name">
              play-circle
            </div>
            <div class="code-name">.icon-play-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-question-circle"></span>
            <div class="name">
              question-circle
            </div>
            <div class="code-name">.icon-question-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Pound"></span>
            <div class="name">
              Pound
            </div>
            <div class="code-name">.icon-Pound
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-right-circle"></span>
            <div class="name">
              right-circle
            </div>
            <div class="code-name">.icon-right-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-smile"></span>
            <div class="name">
              smile
            </div>
            <div class="code-name">.icon-smile
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-trademark"></span>
            <div class="name">
              trademark
            </div>
            <div class="code-name">.icon-trademark
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-time-circle"></span>
            <div class="name">
              time-circle
            </div>
            <div class="code-name">.icon-time-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-timeout"></span>
            <div class="name">
              time out
            </div>
            <div class="code-name">.icon-timeout
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-earth"></span>
            <div class="name">
              earth
            </div>
            <div class="code-name">.icon-earth
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-YUAN"></span>
            <div class="name">
              YUAN
            </div>
            <div class="code-name">.icon-YUAN
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-up-circle"></span>
            <div class="name">
              up-circle
            </div>
            <div class="code-name">.icon-up-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-warning-circle"></span>
            <div class="name">
              warning-circle
            </div>
            <div class="code-name">.icon-warning-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sync"></span>
            <div class="name">
              sync
            </div>
            <div class="code-name">.icon-sync
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-transaction"></span>
            <div class="name">
              transaction
            </div>
            <div class="code-name">.icon-transaction
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-undo"></span>
            <div class="name">
              undo
            </div>
            <div class="code-name">.icon-undo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-redo"></span>
            <div class="name">
              redo
            </div>
            <div class="code-name">.icon-redo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reload"></span>
            <div class="name">
              reload
            </div>
            <div class="code-name">.icon-reload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reloadtime"></span>
            <div class="name">
              reload time
            </div>
            <div class="code-name">.icon-reloadtime
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-message"></span>
            <div class="name">
              message
            </div>
            <div class="code-name">.icon-message
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dashboard"></span>
            <div class="name">
              dashboard
            </div>
            <div class="code-name">.icon-dashboard
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-issuesclose"></span>
            <div class="name">
              issues close
            </div>
            <div class="code-name">.icon-issuesclose
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-poweroff"></span>
            <div class="name">
              poweroff
            </div>
            <div class="code-name">.icon-poweroff
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-logout"></span>
            <div class="name">
              logout
            </div>
            <div class="code-name">.icon-logout
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-piechart"></span>
            <div class="name">
              pie chart
            </div>
            <div class="code-name">.icon-piechart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-setting"></span>
            <div class="name">
              setting
            </div>
            <div class="code-name">.icon-setting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-eye"></span>
            <div class="name">
              eye
            </div>
            <div class="code-name">.icon-eye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-location"></span>
            <div class="name">
              location
            </div>
            <div class="code-name">.icon-location
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-edit-square"></span>
            <div class="name">
              edit-square
            </div>
            <div class="code-name">.icon-edit-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-export"></span>
            <div class="name">
              export
            </div>
            <div class="code-name">.icon-export
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-save"></span>
            <div class="name">
              save
            </div>
            <div class="code-name">.icon-save
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Import"></span>
            <div class="name">
              Import
            </div>
            <div class="code-name">.icon-Import
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-appstore"></span>
            <div class="name">
              app store
            </div>
            <div class="code-name">.icon-appstore
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-close-square"></span>
            <div class="name">
              close-square
            </div>
            <div class="code-name">.icon-close-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-down-square"></span>
            <div class="name">
              down-square
            </div>
            <div class="code-name">.icon-down-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-layout"></span>
            <div class="name">
              layout
            </div>
            <div class="code-name">.icon-layout
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-left-square"></span>
            <div class="name">
              left-square
            </div>
            <div class="code-name">.icon-left-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-play-square"></span>
            <div class="name">
              play-square
            </div>
            <div class="code-name">.icon-play-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-control"></span>
            <div class="name">
              control
            </div>
            <div class="code-name">.icon-control
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-codelibrary"></span>
            <div class="name">
              code library
            </div>
            <div class="code-name">.icon-codelibrary
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-detail"></span>
            <div class="name">
              detail
            </div>
            <div class="code-name">.icon-detail
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-minus-square"></span>
            <div class="name">
              minus-square
            </div>
            <div class="code-name">.icon-minus-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-plus-square"></span>
            <div class="name">
              plus-square
            </div>
            <div class="code-name">.icon-plus-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-right-square"></span>
            <div class="name">
              right-square
            </div>
            <div class="code-name">.icon-right-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-project"></span>
            <div class="name">
              project
            </div>
            <div class="code-name">.icon-project
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-wallet"></span>
            <div class="name">
              wallet
            </div>
            <div class="code-name">.icon-wallet
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-up-square"></span>
            <div class="name">
              up-square
            </div>
            <div class="code-name">.icon-up-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-calculator"></span>
            <div class="name">
              calculator
            </div>
            <div class="code-name">.icon-calculator
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-interation"></span>
            <div class="name">
              interation
            </div>
            <div class="code-name">.icon-interation
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-check-square"></span>
            <div class="name">
              check-square
            </div>
            <div class="code-name">.icon-check-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border"></span>
            <div class="name">
              border
            </div>
            <div class="code-name">.icon-border
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-outer"></span>
            <div class="name">
              border-outer
            </div>
            <div class="code-name">.icon-border-outer
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-top"></span>
            <div class="name">
              border-top
            </div>
            <div class="code-name">.icon-border-top
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-bottom"></span>
            <div class="name">
              border-bottom
            </div>
            <div class="code-name">.icon-border-bottom
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-left"></span>
            <div class="name">
              border-left
            </div>
            <div class="code-name">.icon-border-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-right"></span>
            <div class="name">
              border-right
            </div>
            <div class="code-name">.icon-border-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-inner"></span>
            <div class="name">
              border-inner
            </div>
            <div class="code-name">.icon-border-inner
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-verticle"></span>
            <div class="name">
              border-verticle
            </div>
            <div class="code-name">.icon-border-verticle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-border-horizontal"></span>
            <div class="name">
              border-horizontal
            </div>
            <div class="code-name">.icon-border-horizontal
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-radius-bottomleft"></span>
            <div class="name">
              radius-bottomleft
            </div>
            <div class="code-name">.icon-radius-bottomleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-radius-bottomright"></span>
            <div class="name">
              radius-bottomright
            </div>
            <div class="code-name">.icon-radius-bottomright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-radius-upleft"></span>
            <div class="name">
              radius-upleft
            </div>
            <div class="code-name">.icon-radius-upleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-radius-upright"></span>
            <div class="name">
              radius-upright
            </div>
            <div class="code-name">.icon-radius-upright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-radius-setting"></span>
            <div class="name">
              radius-setting
            </div>
            <div class="code-name">.icon-radius-setting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-adduser"></span>
            <div class="name">
              add user
            </div>
            <div class="code-name">.icon-adduser
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-deleteteam"></span>
            <div class="name">
              delete team
            </div>
            <div class="code-name">.icon-deleteteam
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-deleteuser"></span>
            <div class="name">
              delete user
            </div>
            <div class="code-name">.icon-deleteuser
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-addteam"></span>
            <div class="name">
              addteam
            </div>
            <div class="code-name">.icon-addteam
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-user"></span>
            <div class="name">
              user
            </div>
            <div class="code-name">.icon-user
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-team"></span>
            <div class="name">
              team
            </div>
            <div class="code-name">.icon-team
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-areachart"></span>
            <div class="name">
              area chart
            </div>
            <div class="code-name">.icon-areachart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-linechart"></span>
            <div class="name">
              line chart
            </div>
            <div class="code-name">.icon-linechart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-barchart"></span>
            <div class="name">
              bar chart
            </div>
            <div class="code-name">.icon-barchart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pointmap"></span>
            <div class="name">
              point map
            </div>
            <div class="code-name">.icon-pointmap
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-container"></span>
            <div class="name">
              container
            </div>
            <div class="code-name">.icon-container
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-database"></span>
            <div class="name">
              database
            </div>
            <div class="code-name">.icon-database
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sever"></span>
            <div class="name">
              sever
            </div>
            <div class="code-name">.icon-sever
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-mobile"></span>
            <div class="name">
              mobile
            </div>
            <div class="code-name">.icon-mobile
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-tablet"></span>
            <div class="name">
              tablet
            </div>
            <div class="code-name">.icon-tablet
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-redenvelope"></span>
            <div class="name">
              red envelope
            </div>
            <div class="code-name">.icon-redenvelope
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-book"></span>
            <div class="name">
              book
            </div>
            <div class="code-name">.icon-book
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-filedone"></span>
            <div class="name">
              file done
            </div>
            <div class="code-name">.icon-filedone
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reconciliation"></span>
            <div class="name">
              reconciliation
            </div>
            <div class="code-name">.icon-reconciliation
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-exception"></span>
            <div class="name">
              file -exception
            </div>
            <div class="code-name">.icon-file-exception
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-filesync"></span>
            <div class="name">
              file sync
            </div>
            <div class="code-name">.icon-filesync
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-filesearch"></span>
            <div class="name">
              file search
            </div>
            <div class="code-name">.icon-filesearch
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-solution"></span>
            <div class="name">
              solution
            </div>
            <div class="code-name">.icon-solution
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fileprotect"></span>
            <div class="name">
              file protect
            </div>
            <div class="code-name">.icon-fileprotect
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-add"></span>
            <div class="name">
              file-add
            </div>
            <div class="code-name">.icon-file-add
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-excel"></span>
            <div class="name">
              file-excel
            </div>
            <div class="code-name">.icon-file-excel
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-exclamation"></span>
            <div class="name">
              file-exclamation
            </div>
            <div class="code-name">.icon-file-exclamation
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-pdf"></span>
            <div class="name">
              file-pdf
            </div>
            <div class="code-name">.icon-file-pdf
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-image"></span>
            <div class="name">
              file-image
            </div>
            <div class="code-name">.icon-file-image
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-markdown"></span>
            <div class="name">
              file-markdown
            </div>
            <div class="code-name">.icon-file-markdown
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-unknown"></span>
            <div class="name">
              file-unknown
            </div>
            <div class="code-name">.icon-file-unknown
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-ppt"></span>
            <div class="name">
              file-ppt
            </div>
            <div class="code-name">.icon-file-ppt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-word"></span>
            <div class="name">
              file-word
            </div>
            <div class="code-name">.icon-file-word
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file"></span>
            <div class="name">
              file
            </div>
            <div class="code-name">.icon-file
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-zip"></span>
            <div class="name">
              file-zip
            </div>
            <div class="code-name">.icon-file-zip
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-text"></span>
            <div class="name">
              file-text
            </div>
            <div class="code-name">.icon-file-text
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-copy"></span>
            <div class="name">
              file-copy
            </div>
            <div class="code-name">.icon-file-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-snippets"></span>
            <div class="name">
              snippets
            </div>
            <div class="code-name">.icon-snippets
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-audit"></span>
            <div class="name">
              audit
            </div>
            <div class="code-name">.icon-audit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-diff"></span>
            <div class="name">
              diff
            </div>
            <div class="code-name">.icon-diff
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Batchfolding"></span>
            <div class="name">
              Batch folding
            </div>
            <div class="code-name">.icon-Batchfolding
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-securityscan"></span>
            <div class="name">
              security scan
            </div>
            <div class="code-name">.icon-securityscan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-propertysafety"></span>
            <div class="name">
              property safety
            </div>
            <div class="code-name">.icon-propertysafety
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-safetycertificate"></span>
            <div class="name">
              safety certificate
            </div>
            <div class="code-name">.icon-safetycertificate
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-insurance"></span>
            <div class="name">
              insurance 
            </div>
            <div class="code-name">.icon-insurance
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alert"></span>
            <div class="name">
              alert
            </div>
            <div class="code-name">.icon-alert
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-delete"></span>
            <div class="name">
              delete
            </div>
            <div class="code-name">.icon-delete
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-hourglass"></span>
            <div class="name">
              hourglass
            </div>
            <div class="code-name">.icon-hourglass
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bulb"></span>
            <div class="name">
              bulb
            </div>
            <div class="code-name">.icon-bulb
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-experiment"></span>
            <div class="name">
              experiment
            </div>
            <div class="code-name">.icon-experiment
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bell"></span>
            <div class="name">
              bell
            </div>
            <div class="code-name">.icon-bell
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-trophy"></span>
            <div class="name">
              trophy
            </div>
            <div class="code-name">.icon-trophy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-rest"></span>
            <div class="name">
              rest
            </div>
            <div class="code-name">.icon-rest
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-USB"></span>
            <div class="name">
              USB
            </div>
            <div class="code-name">.icon-USB
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-skin"></span>
            <div class="name">
              skin
            </div>
            <div class="code-name">.icon-skin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-home"></span>
            <div class="name">
              home
            </div>
            <div class="code-name">.icon-home
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bank"></span>
            <div class="name">
              bank
            </div>
            <div class="code-name">.icon-bank
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-filter"></span>
            <div class="name">
              filter
            </div>
            <div class="code-name">.icon-filter
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-funnelplot"></span>
            <div class="name">
              funnel plot
            </div>
            <div class="code-name">.icon-funnelplot
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-like"></span>
            <div class="name">
              like
            </div>
            <div class="code-name">.icon-like
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-unlike"></span>
            <div class="name">
              unlike
            </div>
            <div class="code-name">.icon-unlike
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-unlock"></span>
            <div class="name">
              unlock
            </div>
            <div class="code-name">.icon-unlock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-lock"></span>
            <div class="name">
              lock
            </div>
            <div class="code-name">.icon-lock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-customerservice"></span>
            <div class="name">
              customerservice
            </div>
            <div class="code-name">.icon-customerservice
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-flag"></span>
            <div class="name">
              flag
            </div>
            <div class="code-name">.icon-flag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-moneycollect"></span>
            <div class="name">
              money collect
            </div>
            <div class="code-name">.icon-moneycollect
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-medicinebox"></span>
            <div class="name">
              medicinebox
            </div>
            <div class="code-name">.icon-medicinebox
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shop"></span>
            <div class="name">
              shop
            </div>
            <div class="code-name">.icon-shop
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-rocket"></span>
            <div class="name">
              rocket
            </div>
            <div class="code-name">.icon-rocket
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shopping"></span>
            <div class="name">
              shopping
            </div>
            <div class="code-name">.icon-shopping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-folder"></span>
            <div class="name">
              folder
            </div>
            <div class="code-name">.icon-folder
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-folder-open"></span>
            <div class="name">
              folder-open
            </div>
            <div class="code-name">.icon-folder-open
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-folder-add"></span>
            <div class="name">
              folder-add
            </div>
            <div class="code-name">.icon-folder-add
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-deploymentunit"></span>
            <div class="name">
              deployment unit
            </div>
            <div class="code-name">.icon-deploymentunit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-accountbook"></span>
            <div class="name">
              account book
            </div>
            <div class="code-name">.icon-accountbook
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-contacts"></span>
            <div class="name">
              contacts
            </div>
            <div class="code-name">.icon-contacts
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-carryout"></span>
            <div class="name">
              carry out
            </div>
            <div class="code-name">.icon-carryout
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-calendar-check"></span>
            <div class="name">
              calendar-check
            </div>
            <div class="code-name">.icon-calendar-check
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-calendar"></span>
            <div class="name">
              calendar
            </div>
            <div class="code-name">.icon-calendar
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-scan"></span>
            <div class="name">
              scan
            </div>
            <div class="code-name">.icon-scan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-select"></span>
            <div class="name">
              select
            </div>
            <div class="code-name">.icon-select
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-boxplot"></span>
            <div class="name">
              box plot
            </div>
            <div class="code-name">.icon-boxplot
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-build"></span>
            <div class="name">
              build
            </div>
            <div class="code-name">.icon-build
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sliders"></span>
            <div class="name">
              sliders
            </div>
            <div class="code-name">.icon-sliders
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-laptop"></span>
            <div class="name">
              laptop
            </div>
            <div class="code-name">.icon-laptop
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-barcode"></span>
            <div class="name">
              barcode
            </div>
            <div class="code-name">.icon-barcode
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-camera"></span>
            <div class="name">
              camera
            </div>
            <div class="code-name">.icon-camera
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cluster"></span>
            <div class="name">
              cluster
            </div>
            <div class="code-name">.icon-cluster
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-gateway"></span>
            <div class="name">
              gateway
            </div>
            <div class="code-name">.icon-gateway
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-car"></span>
            <div class="name">
              car
            </div>
            <div class="code-name">.icon-car
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-printer"></span>
            <div class="name">
              printer
            </div>
            <div class="code-name">.icon-printer
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-read"></span>
            <div class="name">
              read
            </div>
            <div class="code-name">.icon-read
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cloud-server"></span>
            <div class="name">
              cloud-server
            </div>
            <div class="code-name">.icon-cloud-server
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cloud-upload"></span>
            <div class="name">
              cloud-upload
            </div>
            <div class="code-name">.icon-cloud-upload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cloud"></span>
            <div class="name">
              cloud
            </div>
            <div class="code-name">.icon-cloud
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cloud-download"></span>
            <div class="name">
              cloud-download
            </div>
            <div class="code-name">.icon-cloud-download
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cloud-sync"></span>
            <div class="name">
              cloud-sync
            </div>
            <div class="code-name">.icon-cloud-sync
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-video"></span>
            <div class="name">
              video
            </div>
            <div class="code-name">.icon-video
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-notification"></span>
            <div class="name">
              notification
            </div>
            <div class="code-name">.icon-notification
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sound"></span>
            <div class="name">
              sound
            </div>
            <div class="code-name">.icon-sound
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-radarchart"></span>
            <div class="name">
              radar chart
            </div>
            <div class="code-name">.icon-radarchart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-qrcode"></span>
            <div class="name">
              qrcode
            </div>
            <div class="code-name">.icon-qrcode
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fund"></span>
            <div class="name">
              fund
            </div>
            <div class="code-name">.icon-fund
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-image"></span>
            <div class="name">
              image
            </div>
            <div class="code-name">.icon-image
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-mail"></span>
            <div class="name">
              mail
            </div>
            <div class="code-name">.icon-mail
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-table"></span>
            <div class="name">
              table
            </div>
            <div class="code-name">.icon-table
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-idcard"></span>
            <div class="name">
              id card
            </div>
            <div class="code-name">.icon-idcard
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-creditcard"></span>
            <div class="name">
              credit card
            </div>
            <div class="code-name">.icon-creditcard
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-heart"></span>
            <div class="name">
              heart
            </div>
            <div class="code-name">.icon-heart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-block"></span>
            <div class="name">
              block
            </div>
            <div class="code-name">.icon-block
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-error"></span>
            <div class="name">
              error
            </div>
            <div class="code-name">.icon-error
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-star"></span>
            <div class="name">
              star
            </div>
            <div class="code-name">.icon-star
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-gold"></span>
            <div class="name">
              gold
            </div>
            <div class="code-name">.icon-gold
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-heatmap"></span>
            <div class="name">
              heat map
            </div>
            <div class="code-name">.icon-heatmap
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-wifi"></span>
            <div class="name">
              wifi
            </div>
            <div class="code-name">.icon-wifi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-attachment"></span>
            <div class="name">
              attachment
            </div>
            <div class="code-name">.icon-attachment
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-edit"></span>
            <div class="name">
              edit
            </div>
            <div class="code-name">.icon-edit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-key"></span>
            <div class="name">
              key
            </div>
            <div class="code-name">.icon-key
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-api"></span>
            <div class="name">
              api
            </div>
            <div class="code-name">.icon-api
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-disconnect"></span>
            <div class="name">
              disconnect
            </div>
            <div class="code-name">.icon-disconnect
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-highlight"></span>
            <div class="name">
              highlight
            </div>
            <div class="code-name">.icon-highlight
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-monitor"></span>
            <div class="name">
              monitor
            </div>
            <div class="code-name">.icon-monitor
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-link"></span>
            <div class="name">
              link
            </div>
            <div class="code-name">.icon-link
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-man"></span>
            <div class="name">
              man
            </div>
            <div class="code-name">.icon-man
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-percentage"></span>
            <div class="name">
              percentage
            </div>
            <div class="code-name">.icon-percentage
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pushpin"></span>
            <div class="name">
              pushpin
            </div>
            <div class="code-name">.icon-pushpin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-phone"></span>
            <div class="name">
              phone
            </div>
            <div class="code-name">.icon-phone
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shake"></span>
            <div class="name">
              shake
            </div>
            <div class="code-name">.icon-shake
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-tag"></span>
            <div class="name">
              tag
            </div>
            <div class="code-name">.icon-tag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-wrench"></span>
            <div class="name">
              wrench
            </div>
            <div class="code-name">.icon-wrench
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-tags"></span>
            <div class="name">
              tags
            </div>
            <div class="code-name">.icon-tags
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-scissor"></span>
            <div class="name">
              scissor
            </div>
            <div class="code-name">.icon-scissor
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-mr"></span>
            <div class="name">
              mr
            </div>
            <div class="code-name">.icon-mr
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-share"></span>
            <div class="name">
              share
            </div>
            <div class="code-name">.icon-share
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-branches"></span>
            <div class="name">
              branches
            </div>
            <div class="code-name">.icon-branches
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fork"></span>
            <div class="name">
              fork
            </div>
            <div class="code-name">.icon-fork
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shrink"></span>
            <div class="name">
              shrink
            </div>
            <div class="code-name">.icon-shrink
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-arrawsalt"></span>
            <div class="name">
              arrawsalt
            </div>
            <div class="code-name">.icon-arrawsalt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-verticalright"></span>
            <div class="name">
              vertical right
            </div>
            <div class="code-name">.icon-verticalright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-verticalleft"></span>
            <div class="name">
              vertical left
            </div>
            <div class="code-name">.icon-verticalleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-right"></span>
            <div class="name">
              right
            </div>
            <div class="code-name">.icon-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-left"></span>
            <div class="name">
              left
            </div>
            <div class="code-name">.icon-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-up"></span>
            <div class="name">
              up
            </div>
            <div class="code-name">.icon-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-down"></span>
            <div class="name">
              down
            </div>
            <div class="code-name">.icon-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fullscreen"></span>
            <div class="name">
              fullscreen
            </div>
            <div class="code-name">.icon-fullscreen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fullscreen-exit"></span>
            <div class="name">
              fullscreen-exit
            </div>
            <div class="code-name">.icon-fullscreen-exit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-doubleleft"></span>
            <div class="name">
              doubleleft
            </div>
            <div class="code-name">.icon-doubleleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-doubleright"></span>
            <div class="name">
              double right
            </div>
            <div class="code-name">.icon-doubleright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-arrowright"></span>
            <div class="name">
              arrowright
            </div>
            <div class="code-name">.icon-arrowright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-arrowup"></span>
            <div class="name">
              arrowup
            </div>
            <div class="code-name">.icon-arrowup
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-arrowleft"></span>
            <div class="name">
              arrowleft
            </div>
            <div class="code-name">.icon-arrowleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-arrowdown"></span>
            <div class="name">
              arrowdown
            </div>
            <div class="code-name">.icon-arrowdown
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-upload"></span>
            <div class="name">
              upload
            </div>
            <div class="code-name">.icon-upload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-colum-height"></span>
            <div class="name">
              colum-height
            </div>
            <div class="code-name">.icon-colum-height
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-vertical-align-botto"></span>
            <div class="name">
              vertical-align-botto
            </div>
            <div class="code-name">.icon-vertical-align-botto
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-vertical-align-middl"></span>
            <div class="name">
              vertical-align-middl
            </div>
            <div class="code-name">.icon-vertical-align-middl
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-totop"></span>
            <div class="name">
              totop
            </div>
            <div class="code-name">.icon-totop
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-vertical-align-top"></span>
            <div class="name">
              vertical-align-top
            </div>
            <div class="code-name">.icon-vertical-align-top
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-download"></span>
            <div class="name">
              download
            </div>
            <div class="code-name">.icon-download
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sort-descending"></span>
            <div class="name">
              sort-descending
            </div>
            <div class="code-name">.icon-sort-descending
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sort-ascending"></span>
            <div class="name">
              sort-ascending
            </div>
            <div class="code-name">.icon-sort-ascending
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fall"></span>
            <div class="name">
              fall
            </div>
            <div class="code-name">.icon-fall
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-swap"></span>
            <div class="name">
              swap
            </div>
            <div class="code-name">.icon-swap
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-stock"></span>
            <div class="name">
              stock
            </div>
            <div class="code-name">.icon-stock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-rise"></span>
            <div class="name">
              rise
            </div>
            <div class="code-name">.icon-rise
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-indent"></span>
            <div class="name">
              indent
            </div>
            <div class="code-name">.icon-indent
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-outdent"></span>
            <div class="name">
              outdent
            </div>
            <div class="code-name">.icon-outdent
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-menu"></span>
            <div class="name">
              menu
            </div>
            <div class="code-name">.icon-menu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-unorderedlist"></span>
            <div class="name">
              unordered list
            </div>
            <div class="code-name">.icon-unorderedlist
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-orderedlist"></span>
            <div class="name">
              ordered list
            </div>
            <div class="code-name">.icon-orderedlist
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-align-right"></span>
            <div class="name">
              align-right
            </div>
            <div class="code-name">.icon-align-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-align-center"></span>
            <div class="name">
              align-center
            </div>
            <div class="code-name">.icon-align-center
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-align-left"></span>
            <div class="name">
              align-left
            </div>
            <div class="code-name">.icon-align-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pic-center"></span>
            <div class="name">
              pic-center
            </div>
            <div class="code-name">.icon-pic-center
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pic-right"></span>
            <div class="name">
              pic-right
            </div>
            <div class="code-name">.icon-pic-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pic-left"></span>
            <div class="name">
              pic-left
            </div>
            <div class="code-name">.icon-pic-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bold"></span>
            <div class="name">
              bold
            </div>
            <div class="code-name">.icon-bold
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-font-colors"></span>
            <div class="name">
              font-colors
            </div>
            <div class="code-name">.icon-font-colors
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-exclaimination"></span>
            <div class="name">
              exclaimination
            </div>
            <div class="code-name">.icon-exclaimination
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-font-size"></span>
            <div class="name">
              font-size
            </div>
            <div class="code-name">.icon-font-size
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-infomation"></span>
            <div class="name">
              infomation
            </div>
            <div class="code-name">.icon-infomation
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-line-height"></span>
            <div class="name">
              line-height
            </div>
            <div class="code-name">.icon-line-height
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-strikethrough"></span>
            <div class="name">
              strikethrough
            </div>
            <div class="code-name">.icon-strikethrough
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-underline"></span>
            <div class="name">
              underline
            </div>
            <div class="code-name">.icon-underline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-number"></span>
            <div class="name">
              number
            </div>
            <div class="code-name">.icon-number
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-italic"></span>
            <div class="name">
              italic
            </div>
            <div class="code-name">.icon-italic
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-code"></span>
            <div class="name">
              code
            </div>
            <div class="code-name">.icon-code
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-column-width"></span>
            <div class="name">
              column-width
            </div>
            <div class="code-name">.icon-column-width
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-check"></span>
            <div class="name">
              check
            </div>
            <div class="code-name">.icon-check
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-ellipsis"></span>
            <div class="name">
              ellipsis
            </div>
            <div class="code-name">.icon-ellipsis
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dash"></span>
            <div class="name">
              dash
            </div>
            <div class="code-name">.icon-dash
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-close"></span>
            <div class="name">
              close
            </div>
            <div class="code-name">.icon-close
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-enter"></span>
            <div class="name">
              enter
            </div>
            <div class="code-name">.icon-enter
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-line"></span>
            <div class="name">
              line
            </div>
            <div class="code-name">.icon-line
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-minus"></span>
            <div class="name">
              minus
            </div>
            <div class="code-name">.icon-minus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-question"></span>
            <div class="name">
              question
            </div>
            <div class="code-name">.icon-question
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-plus"></span>
            <div class="name">
              plus
            </div>
            <div class="code-name">.icon-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-rollback"></span>
            <div class="name">
              rollback
            </div>
            <div class="code-name">.icon-rollback
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-small-dash"></span>
            <div class="name">
              small-dash
            </div>
            <div class="code-name">.icon-small-dash
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pause"></span>
            <div class="name">
              pause
            </div>
            <div class="code-name">.icon-pause
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bg-colors"></span>
            <div class="name">
              bg-colors
            </div>
            <div class="code-name">.icon-bg-colors
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-crown"></span>
            <div class="name">
              crown
            </div>
            <div class="code-name">.icon-crown
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-drag"></span>
            <div class="name">
              drag
            </div>
            <div class="code-name">.icon-drag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-desktop"></span>
            <div class="name">
              desktop
            </div>
            <div class="code-name">.icon-desktop
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-gift"></span>
            <div class="name">
              gift
            </div>
            <div class="code-name">.icon-gift
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-stop"></span>
            <div class="name">
              stop
            </div>
            <div class="code-name">.icon-stop
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fire"></span>
            <div class="name">
              fire
            </div>
            <div class="code-name">.icon-fire
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-thunderbolt"></span>
            <div class="name">
              thunderbolt
            </div>
            <div class="code-name">.icon-thunderbolt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-check-circle-fill"></span>
            <div class="name">
              check-circle-fill
            </div>
            <div class="code-name">.icon-check-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-left-circle-fill"></span>
            <div class="name">
              left-circle-fill
            </div>
            <div class="code-name">.icon-left-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-down-circle-fill"></span>
            <div class="name">
              down-circle-fill
            </div>
            <div class="code-name">.icon-down-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-minus-circle-fill"></span>
            <div class="name">
              minus-circle-fill
            </div>
            <div class="code-name">.icon-minus-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-close-circle-fill"></span>
            <div class="name">
              close-circle-fill
            </div>
            <div class="code-name">.icon-close-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-info-circle-fill"></span>
            <div class="name">
              info-circle-fill
            </div>
            <div class="code-name">.icon-info-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-up-circle-fill"></span>
            <div class="name">
              up-circle-fill
            </div>
            <div class="code-name">.icon-up-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-right-circle-fill"></span>
            <div class="name">
              right-circle-fill
            </div>
            <div class="code-name">.icon-right-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-plus-circle-fill"></span>
            <div class="name">
              plus-circle-fill
            </div>
            <div class="code-name">.icon-plus-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-question-circle-fill"></span>
            <div class="name">
              question-circle-fill
            </div>
            <div class="code-name">.icon-question-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-EURO-circle-fill"></span>
            <div class="name">
              EURO-circle-fill
            </div>
            <div class="code-name">.icon-EURO-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-frown-fill"></span>
            <div class="name">
              frown-fill
            </div>
            <div class="code-name">.icon-frown-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-copyright-circle-fil"></span>
            <div class="name">
              copyright-circle-fil
            </div>
            <div class="code-name">.icon-copyright-circle-fil
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-CI-circle-fill"></span>
            <div class="name">
              CI-circle-fill
            </div>
            <div class="code-name">.icon-CI-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-compass-fill"></span>
            <div class="name">
              compass-fill
            </div>
            <div class="code-name">.icon-compass-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Dollar-circle-fill"></span>
            <div class="name">
              Dollar-circle-fill
            </div>
            <div class="code-name">.icon-Dollar-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-poweroff-circle-fill"></span>
            <div class="name">
              poweroff-circle-fill
            </div>
            <div class="code-name">.icon-poweroff-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-meh-fill"></span>
            <div class="name">
              meh-fill
            </div>
            <div class="code-name">.icon-meh-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-play-circle-fill"></span>
            <div class="name">
              play-circle-fill
            </div>
            <div class="code-name">.icon-play-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Pound-circle-fill"></span>
            <div class="name">
              Pound-circle-fill
            </div>
            <div class="code-name">.icon-Pound-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-smile-fill"></span>
            <div class="name">
              smile-fill
            </div>
            <div class="code-name">.icon-smile-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-stop-fill"></span>
            <div class="name">
              stop-fill
            </div>
            <div class="code-name">.icon-stop-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-warning-circle-fill"></span>
            <div class="name">
              warning-circle-fill
            </div>
            <div class="code-name">.icon-warning-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-time-circle-fill"></span>
            <div class="name">
              time-circle-fill
            </div>
            <div class="code-name">.icon-time-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-trademark-circle-fil"></span>
            <div class="name">
              trademark-circle-fil
            </div>
            <div class="code-name">.icon-trademark-circle-fil
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-YUAN-circle-fill"></span>
            <div class="name">
              YUAN-circle-fill
            </div>
            <div class="code-name">.icon-YUAN-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-heart-fill"></span>
            <div class="name">
              heart-fill
            </div>
            <div class="code-name">.icon-heart-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-piechart-circle-fil"></span>
            <div class="name">
              pie chart-circle-fil
            </div>
            <div class="code-name">.icon-piechart-circle-fil
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dashboard-fill"></span>
            <div class="name">
              dashboard-fill
            </div>
            <div class="code-name">.icon-dashboard-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-message-fill"></span>
            <div class="name">
              message-fill
            </div>
            <div class="code-name">.icon-message-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-check-square-fill"></span>
            <div class="name">
              check-square-fill
            </div>
            <div class="code-name">.icon-check-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-down-square-fill"></span>
            <div class="name">
              down-square-fill
            </div>
            <div class="code-name">.icon-down-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-minus-square-fill"></span>
            <div class="name">
              minus-square-fill
            </div>
            <div class="code-name">.icon-minus-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-close-square-fill"></span>
            <div class="name">
              close-square-fill
            </div>
            <div class="code-name">.icon-close-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-codelibrary-fill"></span>
            <div class="name">
              code library-fill
            </div>
            <div class="code-name">.icon-codelibrary-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-left-square-fill"></span>
            <div class="name">
              left-square-fill
            </div>
            <div class="code-name">.icon-left-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-play-square-fill"></span>
            <div class="name">
              play-square-fill
            </div>
            <div class="code-name">.icon-play-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-up-square-fill"></span>
            <div class="name">
              up-square-fill
            </div>
            <div class="code-name">.icon-up-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-right-square-fill"></span>
            <div class="name">
              right-square-fill
            </div>
            <div class="code-name">.icon-right-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-plus-square-fill"></span>
            <div class="name">
              plus-square-fill
            </div>
            <div class="code-name">.icon-plus-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-accountbook-fill"></span>
            <div class="name">
              account book-fill
            </div>
            <div class="code-name">.icon-accountbook-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-carryout-fill"></span>
            <div class="name">
              carry out-fill
            </div>
            <div class="code-name">.icon-carryout-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-calendar-fill"></span>
            <div class="name">
              calendar-fill
            </div>
            <div class="code-name">.icon-calendar-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-calculator-fill"></span>
            <div class="name">
              calculator-fill
            </div>
            <div class="code-name">.icon-calculator-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-interation-fill"></span>
            <div class="name">
              interation-fill
            </div>
            <div class="code-name">.icon-interation-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-project-fill"></span>
            <div class="name">
              project-fill
            </div>
            <div class="code-name">.icon-project-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-detail-fill"></span>
            <div class="name">
              detail-fill
            </div>
            <div class="code-name">.icon-detail-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-save-fill"></span>
            <div class="name">
              save-fill
            </div>
            <div class="code-name">.icon-save-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-wallet-fill"></span>
            <div class="name">
              wallet-fill
            </div>
            <div class="code-name">.icon-wallet-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-control-fill"></span>
            <div class="name">
              control-fill
            </div>
            <div class="code-name">.icon-control-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-layout-fill"></span>
            <div class="name">
              layout-fill
            </div>
            <div class="code-name">.icon-layout-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-appstore-fill"></span>
            <div class="name">
              app store-fill
            </div>
            <div class="code-name">.icon-appstore-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-mobile-fill"></span>
            <div class="name">
              mobile-fill
            </div>
            <div class="code-name">.icon-mobile-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-tablet-fill"></span>
            <div class="name">
              tablet-fill
            </div>
            <div class="code-name">.icon-tablet-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-book-fill"></span>
            <div class="name">
              book-fill
            </div>
            <div class="code-name">.icon-book-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-redenvelope-fill"></span>
            <div class="name">
              red envelope-fill
            </div>
            <div class="code-name">.icon-redenvelope-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-safetycertificate-f"></span>
            <div class="name">
              safety certificate-f
            </div>
            <div class="code-name">.icon-safetycertificate-f
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-propertysafety-fill"></span>
            <div class="name">
              property safety-fill
            </div>
            <div class="code-name">.icon-propertysafety-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-insurance-fill"></span>
            <div class="name">
              insurance-fill
            </div>
            <div class="code-name">.icon-insurance-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-securityscan-fill"></span>
            <div class="name">
              security scan-fill
            </div>
            <div class="code-name">.icon-securityscan-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-exclamation-fil"></span>
            <div class="name">
              file-exclamation-fil
            </div>
            <div class="code-name">.icon-file-exclamation-fil
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-add-fill"></span>
            <div class="name">
              file-add-fill
            </div>
            <div class="code-name">.icon-file-add-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-fill"></span>
            <div class="name">
              file-fill
            </div>
            <div class="code-name">.icon-file-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-excel-fill"></span>
            <div class="name">
              file-excel-fill
            </div>
            <div class="code-name">.icon-file-excel-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-markdown-fill"></span>
            <div class="name">
              file-markdown-fill
            </div>
            <div class="code-name">.icon-file-markdown-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-text-fill"></span>
            <div class="name">
              file-text-fill
            </div>
            <div class="code-name">.icon-file-text-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-ppt-fill"></span>
            <div class="name">
              file-ppt-fill
            </div>
            <div class="code-name">.icon-file-ppt-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-unknown-fill"></span>
            <div class="name">
              file-unknown-fill
            </div>
            <div class="code-name">.icon-file-unknown-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-word-fill"></span>
            <div class="name">
              file-word-fill
            </div>
            <div class="code-name">.icon-file-word-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-zip-fill"></span>
            <div class="name">
              file-zip-fill
            </div>
            <div class="code-name">.icon-file-zip-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-pdf-fill"></span>
            <div class="name">
              file-pdf-fill
            </div>
            <div class="code-name">.icon-file-pdf-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-image-fill"></span>
            <div class="name">
              file-image-fill
            </div>
            <div class="code-name">.icon-file-image-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-diff-fill"></span>
            <div class="name">
              diff-fill
            </div>
            <div class="code-name">.icon-diff-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-file-copy-fill"></span>
            <div class="name">
              file-copy-fill
            </div>
            <div class="code-name">.icon-file-copy-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-snippets-fill"></span>
            <div class="name">
              snippets-fill
            </div>
            <div class="code-name">.icon-snippets-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-batchfolding-fill"></span>
            <div class="name">
              batch folding-fill
            </div>
            <div class="code-name">.icon-batchfolding-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reconciliation-fill"></span>
            <div class="name">
              reconciliation-fill
            </div>
            <div class="code-name">.icon-reconciliation-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-folder-add-fill"></span>
            <div class="name">
              folder-add-fill
            </div>
            <div class="code-name">.icon-folder-add-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-folder-fill"></span>
            <div class="name">
              folder-fill
            </div>
            <div class="code-name">.icon-folder-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-folder-open-fill"></span>
            <div class="name">
              folder-open-fill
            </div>
            <div class="code-name">.icon-folder-open-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-database-fill"></span>
            <div class="name">
              database-fill
            </div>
            <div class="code-name">.icon-database-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-container-fill"></span>
            <div class="name">
              container-fill
            </div>
            <div class="code-name">.icon-container-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sever-fill"></span>
            <div class="name">
              sever-fill
            </div>
            <div class="code-name">.icon-sever-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-calendar-check-fill"></span>
            <div class="name">
              calendar-check-fill
            </div>
            <div class="code-name">.icon-calendar-check-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-image-fill"></span>
            <div class="name">
              image-fill
            </div>
            <div class="code-name">.icon-image-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-idcard-fill"></span>
            <div class="name">
              id card-fill
            </div>
            <div class="code-name">.icon-idcard-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-creditcard-fill"></span>
            <div class="name">
              credit card-fill
            </div>
            <div class="code-name">.icon-creditcard-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fund-fill"></span>
            <div class="name">
              fund-fill
            </div>
            <div class="code-name">.icon-fund-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-read-fill"></span>
            <div class="name">
              read-fill
            </div>
            <div class="code-name">.icon-read-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-contacts-fill"></span>
            <div class="name">
              contacts-fill
            </div>
            <div class="code-name">.icon-contacts-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-delete-fill"></span>
            <div class="name">
              delete-fill
            </div>
            <div class="code-name">.icon-delete-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-notification-fill"></span>
            <div class="name">
              notification-fill
            </div>
            <div class="code-name">.icon-notification-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-flag-fill"></span>
            <div class="name">
              flag-fill
            </div>
            <div class="code-name">.icon-flag-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-moneycollect-fill"></span>
            <div class="name">
              money collect-fill
            </div>
            <div class="code-name">.icon-moneycollect-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-medicinebox-fill"></span>
            <div class="name">
              medicine box-fill
            </div>
            <div class="code-name">.icon-medicinebox-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-rest-fill"></span>
            <div class="name">
              rest-fill
            </div>
            <div class="code-name">.icon-rest-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shopping-fill"></span>
            <div class="name">
              shopping-fill
            </div>
            <div class="code-name">.icon-shopping-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-skin-fill"></span>
            <div class="name">
              skin-fill
            </div>
            <div class="code-name">.icon-skin-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-video-fill"></span>
            <div class="name">
              video-fill
            </div>
            <div class="code-name">.icon-video-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sound-fill"></span>
            <div class="name">
              sound-fill
            </div>
            <div class="code-name">.icon-sound-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bulb-fill"></span>
            <div class="name">
              bulb-fill
            </div>
            <div class="code-name">.icon-bulb-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bell-fill"></span>
            <div class="name">
              bell-fill
            </div>
            <div class="code-name">.icon-bell-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-filter-fill"></span>
            <div class="name">
              filter-fill
            </div>
            <div class="code-name">.icon-filter-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fire-fill"></span>
            <div class="name">
              fire-fill
            </div>
            <div class="code-name">.icon-fire-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-funnelplot-fill"></span>
            <div class="name">
              funnel plot-fill
            </div>
            <div class="code-name">.icon-funnelplot-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-gift-fill"></span>
            <div class="name">
              gift-fill
            </div>
            <div class="code-name">.icon-gift-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-hourglass-fill"></span>
            <div class="name">
              hourglass-fill
            </div>
            <div class="code-name">.icon-hourglass-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-home-fill"></span>
            <div class="name">
              home-fill
            </div>
            <div class="code-name">.icon-home-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-trophy-fill"></span>
            <div class="name">
              trophy-fill
            </div>
            <div class="code-name">.icon-trophy-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-location-fill"></span>
            <div class="name">
              location-fill
            </div>
            <div class="code-name">.icon-location-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-cloud-fill"></span>
            <div class="name">
              cloud-fill
            </div>
            <div class="code-name">.icon-cloud-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-customerservice-fill"></span>
            <div class="name">
              customerservice-fill
            </div>
            <div class="code-name">.icon-customerservice-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-experiment-fill"></span>
            <div class="name">
              experiment-fill
            </div>
            <div class="code-name">.icon-experiment-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-eye-fill"></span>
            <div class="name">
              eye-fill
            </div>
            <div class="code-name">.icon-eye-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-like-fill"></span>
            <div class="name">
              like-fill
            </div>
            <div class="code-name">.icon-like-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-lock-fill"></span>
            <div class="name">
              lock-fill
            </div>
            <div class="code-name">.icon-lock-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-unlike-fill"></span>
            <div class="name">
              unlike-fill
            </div>
            <div class="code-name">.icon-unlike-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-star-fill"></span>
            <div class="name">
              star-fill
            </div>
            <div class="code-name">.icon-star-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-unlock-fill"></span>
            <div class="name">
              unlock-fill
            </div>
            <div class="code-name">.icon-unlock-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alert-fill"></span>
            <div class="name">
              alert-fill
            </div>
            <div class="code-name">.icon-alert-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-api-fill"></span>
            <div class="name">
              api-fill
            </div>
            <div class="code-name">.icon-api-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-highlight-fill"></span>
            <div class="name">
              highlight-fill
            </div>
            <div class="code-name">.icon-highlight-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-phone-fill"></span>
            <div class="name">
              phone-fill
            </div>
            <div class="code-name">.icon-phone-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-edit-fill"></span>
            <div class="name">
              edit-fill
            </div>
            <div class="code-name">.icon-edit-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-pushpin-fill"></span>
            <div class="name">
              pushpin-fill
            </div>
            <div class="code-name">.icon-pushpin-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-rocket-fill"></span>
            <div class="name">
              rocket-fill
            </div>
            <div class="code-name">.icon-rocket-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-thunderbolt-fill"></span>
            <div class="name">
              thunderbolt-fill
            </div>
            <div class="code-name">.icon-thunderbolt-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-tag-fill"></span>
            <div class="name">
              tag-fill
            </div>
            <div class="code-name">.icon-tag-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-wrench-fill"></span>
            <div class="name">
              wrench-fill
            </div>
            <div class="code-name">.icon-wrench-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-tags-fill"></span>
            <div class="name">
              tags-fill
            </div>
            <div class="code-name">.icon-tags-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bank-fill"></span>
            <div class="name">
              bank-fill
            </div>
            <div class="code-name">.icon-bank-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-camera-fill"></span>
            <div class="name">
              camera-fill
            </div>
            <div class="code-name">.icon-camera-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-error-fill"></span>
            <div class="name">
              error-fill
            </div>
            <div class="code-name">.icon-error-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-crown-fill"></span>
            <div class="name">
              crown-fill
            </div>
            <div class="code-name">.icon-crown-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-mail-fill"></span>
            <div class="name">
              mail-fill
            </div>
            <div class="code-name">.icon-mail-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-car-fill"></span>
            <div class="name">
              car-fill
            </div>
            <div class="code-name">.icon-car-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-printer-fill"></span>
            <div class="name">
              printer-fill
            </div>
            <div class="code-name">.icon-printer-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shop-fill"></span>
            <div class="name">
              shop-fill
            </div>
            <div class="code-name">.icon-shop-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-setting-fill"></span>
            <div class="name">
              setting-fill
            </div>
            <div class="code-name">.icon-setting-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-USB-fill"></span>
            <div class="name">
              USB-fill
            </div>
            <div class="code-name">.icon-USB-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-golden-fill"></span>
            <div class="name">
              golden-fill
            </div>
            <div class="code-name">.icon-golden-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-build-fill"></span>
            <div class="name">
              build-fill
            </div>
            <div class="code-name">.icon-build-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-boxplot-fill"></span>
            <div class="name">
              box plot-fill
            </div>
            <div class="code-name">.icon-boxplot-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sliders-fill"></span>
            <div class="name">
              sliders-fill
            </div>
            <div class="code-name">.icon-sliders-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alibaba"></span>
            <div class="name">
              alibaba
            </div>
            <div class="code-name">.icon-alibaba
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alibabacloud"></span>
            <div class="name">
              alibabacloud
            </div>
            <div class="code-name">.icon-alibabacloud
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-antdesign"></span>
            <div class="name">
              ant design
            </div>
            <div class="code-name">.icon-antdesign
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-ant-cloud"></span>
            <div class="name">
              ant-cloud
            </div>
            <div class="code-name">.icon-ant-cloud
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-behance"></span>
            <div class="name">
              behance
            </div>
            <div class="code-name">.icon-behance
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-googleplus"></span>
            <div class="name">
              google plus
            </div>
            <div class="code-name">.icon-googleplus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-medium"></span>
            <div class="name">
              medium
            </div>
            <div class="code-name">.icon-medium
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-google"></span>
            <div class="name">
              google
            </div>
            <div class="code-name">.icon-google
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-IE"></span>
            <div class="name">
              IE
            </div>
            <div class="code-name">.icon-IE
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-amazon"></span>
            <div class="name">
              amazon
            </div>
            <div class="code-name">.icon-amazon
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-slack"></span>
            <div class="name">
              slack
            </div>
            <div class="code-name">.icon-slack
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alipay"></span>
            <div class="name">
              alipay
            </div>
            <div class="code-name">.icon-alipay
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-taobao"></span>
            <div class="name">
              taobao
            </div>
            <div class="code-name">.icon-taobao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-zhihu"></span>
            <div class="name">
              zhihu
            </div>
            <div class="code-name">.icon-zhihu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-HTML"></span>
            <div class="name">
              HTML5
            </div>
            <div class="code-name">.icon-HTML
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-linkedin"></span>
            <div class="name">
              linkedin
            </div>
            <div class="code-name">.icon-linkedin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-yahoo"></span>
            <div class="name">
              yahoo
            </div>
            <div class="code-name">.icon-yahoo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-facebook"></span>
            <div class="name">
              facebook
            </div>
            <div class="code-name">.icon-facebook
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-skype"></span>
            <div class="name">
              skype
            </div>
            <div class="code-name">.icon-skype
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-CodeSandbox"></span>
            <div class="name">
              CodeSandbox
            </div>
            <div class="code-name">.icon-CodeSandbox
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-chrome"></span>
            <div class="name">
              chrome
            </div>
            <div class="code-name">.icon-chrome
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-codepen"></span>
            <div class="name">
              codepen
            </div>
            <div class="code-name">.icon-codepen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-aliwangwang"></span>
            <div class="name">
              aliwangwang
            </div>
            <div class="code-name">.icon-aliwangwang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-apple"></span>
            <div class="name">
              apple
            </div>
            <div class="code-name">.icon-apple
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-android"></span>
            <div class="name">
              android
            </div>
            <div class="code-name">.icon-android
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sketch"></span>
            <div class="name">
              sketch
            </div>
            <div class="code-name">.icon-sketch
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Gitlab"></span>
            <div class="name">
              Gitlab
            </div>
            <div class="code-name">.icon-Gitlab
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dribbble"></span>
            <div class="name">
              dribbble
            </div>
            <div class="code-name">.icon-dribbble
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-instagram"></span>
            <div class="name">
              instagram
            </div>
            <div class="code-name">.icon-instagram
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reddit"></span>
            <div class="name">
              reddit
            </div>
            <div class="code-name">.icon-reddit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-windows"></span>
            <div class="name">
              windows
            </div>
            <div class="code-name">.icon-windows
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-yuque"></span>
            <div class="name">
              yuque
            </div>
            <div class="code-name">.icon-yuque
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Youtube"></span>
            <div class="name">
              Youtube
            </div>
            <div class="code-name">.icon-Youtube
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Gitlab-fill"></span>
            <div class="name">
              Gitlab-fill
            </div>
            <div class="code-name">.icon-Gitlab-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dropbox"></span>
            <div class="name">
              dropbox
            </div>
            <div class="code-name">.icon-dropbox
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dingtalk"></span>
            <div class="name">
              dingtalk
            </div>
            <div class="code-name">.icon-dingtalk
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-android-fill"></span>
            <div class="name">
              android-fill
            </div>
            <div class="code-name">.icon-android-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-apple-fill"></span>
            <div class="name">
              apple-fill
            </div>
            <div class="code-name">.icon-apple-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-HTML-fill"></span>
            <div class="name">
              HTML5-fill
            </div>
            <div class="code-name">.icon-HTML-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-windows-fill"></span>
            <div class="name">
              windows-fill
            </div>
            <div class="code-name">.icon-windows-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-QQ"></span>
            <div class="name">
              QQ
            </div>
            <div class="code-name">.icon-QQ
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-twitter"></span>
            <div class="name">
              twitter
            </div>
            <div class="code-name">.icon-twitter
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-skype-fill"></span>
            <div class="name">
              skype-fill
            </div>
            <div class="code-name">.icon-skype-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-weibo"></span>
            <div class="name">
              weibo
            </div>
            <div class="code-name">.icon-weibo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-yuque-fill"></span>
            <div class="name">
              yuque-fill
            </div>
            <div class="code-name">.icon-yuque-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-Youtube-fill"></span>
            <div class="name">
              Youtube-fill
            </div>
            <div class="code-name">.icon-Youtube-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-yahoo-fill"></span>
            <div class="name">
              yahoo-fill
            </div>
            <div class="code-name">.icon-yahoo-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-wechat-fill"></span>
            <div class="name">
              wechat-fill
            </div>
            <div class="code-name">.icon-wechat-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-chrome-fill"></span>
            <div class="name">
              chrome-fill
            </div>
            <div class="code-name">.icon-chrome-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alipay-circle-fill"></span>
            <div class="name">
              alipay-circle-fill
            </div>
            <div class="code-name">.icon-alipay-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-aliwangwang-fill"></span>
            <div class="name">
              aliwangwang-fill
            </div>
            <div class="code-name">.icon-aliwangwang-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-behance-circle-fill"></span>
            <div class="name">
              behance-circle-fill
            </div>
            <div class="code-name">.icon-behance-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-amazon-circle-fill"></span>
            <div class="name">
              amazon-circle-fill
            </div>
            <div class="code-name">.icon-amazon-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-codepen-circle-fill"></span>
            <div class="name">
              codepen-circle-fill
            </div>
            <div class="code-name">.icon-codepen-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-CodeSandbox-circle-f"></span>
            <div class="name">
              CodeSandbox-circle-f
            </div>
            <div class="code-name">.icon-CodeSandbox-circle-f
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dropbox-circle-fill"></span>
            <div class="name">
              dropbox-circle-fill
            </div>
            <div class="code-name">.icon-dropbox-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-github-fill"></span>
            <div class="name">
              github-fill
            </div>
            <div class="code-name">.icon-github-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dribbble-circle-fill"></span>
            <div class="name">
              dribbble-circle-fill
            </div>
            <div class="code-name">.icon-dribbble-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-googleplus-circle-f"></span>
            <div class="name">
              google plus-circle-f
            </div>
            <div class="code-name">.icon-googleplus-circle-f
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-medium-circle-fill"></span>
            <div class="name">
              medium-circle-fill
            </div>
            <div class="code-name">.icon-medium-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-QQ-circle-fill"></span>
            <div class="name">
              QQ-circle-fill
            </div>
            <div class="code-name">.icon-QQ-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-IE-circle-fill"></span>
            <div class="name">
              IE-circle-fill
            </div>
            <div class="code-name">.icon-IE-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-google-circle-fill"></span>
            <div class="name">
              google-circle-fill
            </div>
            <div class="code-name">.icon-google-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dingtalk-circle-fill"></span>
            <div class="name">
              dingtalk-circle-fill
            </div>
            <div class="code-name">.icon-dingtalk-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sketch-circle-fill"></span>
            <div class="name">
              sketch-circle-fill
            </div>
            <div class="code-name">.icon-sketch-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-slack-circle-fill"></span>
            <div class="name">
              slack-circle-fill
            </div>
            <div class="code-name">.icon-slack-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-twitter-circle-fill"></span>
            <div class="name">
              twitter-circle-fill
            </div>
            <div class="code-name">.icon-twitter-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-taobao-circle-fill"></span>
            <div class="name">
              taobao-circle-fill
            </div>
            <div class="code-name">.icon-taobao-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-weibo-circle-fill"></span>
            <div class="name">
              weibo-circle-fill
            </div>
            <div class="code-name">.icon-weibo-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-zhihu-circle-fill"></span>
            <div class="name">
              zhihu-circle-fill
            </div>
            <div class="code-name">.icon-zhihu-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reddit-circle-fill"></span>
            <div class="name">
              reddit-circle-fill
            </div>
            <div class="code-name">.icon-reddit-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-alipay-square-fill"></span>
            <div class="name">
              alipay-square-fill
            </div>
            <div class="code-name">.icon-alipay-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dingtalk-square-fill"></span>
            <div class="name">
              dingtalk-square-fill
            </div>
            <div class="code-name">.icon-dingtalk-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-CodeSandbox-square-f"></span>
            <div class="name">
              CodeSandbox-square-f
            </div>
            <div class="code-name">.icon-CodeSandbox-square-f
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-behance-square-fill"></span>
            <div class="name">
              behance-square-fill
            </div>
            <div class="code-name">.icon-behance-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-amazon-square-fill"></span>
            <div class="name">
              amazon-square-fill
            </div>
            <div class="code-name">.icon-amazon-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-codepen-square-fill"></span>
            <div class="name">
              codepen-square-fill
            </div>
            <div class="code-name">.icon-codepen-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dribbble-square-fill"></span>
            <div class="name">
              dribbble-square-fill
            </div>
            <div class="code-name">.icon-dribbble-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-dropbox-square-fill"></span>
            <div class="name">
              dropbox-square-fill
            </div>
            <div class="code-name">.icon-dropbox-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-facebook-fill"></span>
            <div class="name">
              facebook-fill
            </div>
            <div class="code-name">.icon-facebook-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-googleplus-square-f"></span>
            <div class="name">
              google plus-square-f
            </div>
            <div class="code-name">.icon-googleplus-square-f
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-google-square-fill"></span>
            <div class="name">
              google-square-fill
            </div>
            <div class="code-name">.icon-google-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-instagram-fill"></span>
            <div class="name">
              instagram-fill
            </div>
            <div class="code-name">.icon-instagram-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-IE-square-fill"></span>
            <div class="name">
              IE-square-fill
            </div>
            <div class="code-name">.icon-IE-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-medium-square-fill"></span>
            <div class="name">
              medium-square-fill
            </div>
            <div class="code-name">.icon-medium-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-linkedin-fill"></span>
            <div class="name">
              linkedin-fill
            </div>
            <div class="code-name">.icon-linkedin-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-QQ-square-fill"></span>
            <div class="name">
              QQ-square-fill
            </div>
            <div class="code-name">.icon-QQ-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-reddit-square-fill"></span>
            <div class="name">
              reddit-square-fill
            </div>
            <div class="code-name">.icon-reddit-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-twitter-square-fill"></span>
            <div class="name">
              twitter-square-fill
            </div>
            <div class="code-name">.icon-twitter-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-sketch-square-fill"></span>
            <div class="name">
              sketch-square-fill
            </div>
            <div class="code-name">.icon-sketch-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-slack-square-fill"></span>
            <div class="name">
              slack-square-fill
            </div>
            <div class="code-name">.icon-slack-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-taobao-square-fill"></span>
            <div class="name">
              taobao-square-fill
            </div>
            <div class="code-name">.icon-taobao-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-weibo-square-fill"></span>
            <div class="name">
              weibo-square-fill
            </div>
            <div class="code-name">.icon-weibo-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-zhihu-square-fill"></span>
            <div class="name">
              zhihu-square-fill
            </div>
            <div class="code-name">.icon-zhihu-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-zoomout"></span>
            <div class="name">
              zoom out
            </div>
            <div class="code-name">.icon-zoomout
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-apartment"></span>
            <div class="name">
              apartment
            </div>
            <div class="code-name">.icon-apartment
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-audio"></span>
            <div class="name">
              audio
            </div>
            <div class="code-name">.icon-audio
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-audio-fill"></span>
            <div class="name">
              audio-fill
            </div>
            <div class="code-name">.icon-audio-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-robot"></span>
            <div class="name">
              robot
            </div>
            <div class="code-name">.icon-robot
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-zoomin"></span>
            <div class="name">
              zoom in
            </div>
            <div class="code-name">.icon-zoomin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-robot-fill"></span>
            <div class="name">
              robot-fill
            </div>
            <div class="code-name">.icon-robot-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bug-fill"></span>
            <div class="name">
              bug-fill
            </div>
            <div class="code-name">.icon-bug-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-bug"></span>
            <div class="name">
              bug
            </div>
            <div class="code-name">.icon-bug
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-audiostatic"></span>
            <div class="name">
              audio static
            </div>
            <div class="code-name">.icon-audiostatic
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-comment"></span>
            <div class="name">
              comment
            </div>
            <div class="code-name">.icon-comment
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-signal-fill"></span>
            <div class="name">
              signal-fill
            </div>
            <div class="code-name">.icon-signal-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-verified"></span>
            <div class="name">
              verified
            </div>
            <div class="code-name">.icon-verified
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-shortcut-fill"></span>
            <div class="name">
              shortcut-fill
            </div>
            <div class="code-name">.icon-shortcut-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-videocameraadd"></span>
            <div class="name">
              videocamera add
            </div>
            <div class="code-name">.icon-videocameraadd
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-switchuser"></span>
            <div class="name">
              switch user
            </div>
            <div class="code-name">.icon-switchuser
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-whatsapp"></span>
            <div class="name">
              whatsapp
            </div>
            <div class="code-name">.icon-whatsapp
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-appstoreadd"></span>
            <div class="name">
              appstore add
            </div>
            <div class="code-name">.icon-appstoreadd
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-caret-down"></span>
            <div class="name">
              caret-down
            </div>
            <div class="code-name">.icon-caret-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-backward"></span>
            <div class="name">
              backward
            </div>
            <div class="code-name">.icon-backward
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-caret-up"></span>
            <div class="name">
              caret-up
            </div>
            <div class="code-name">.icon-caret-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-caret-right"></span>
            <div class="name">
              caret-right
            </div>
            <div class="code-name">.icon-caret-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-caret-left"></span>
            <div class="name">
              caret-left
            </div>
            <div class="code-name">.icon-caret-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fast-backward"></span>
            <div class="name">
              fast-backward
            </div>
            <div class="code-name">.icon-fast-backward
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-forward"></span>
            <div class="name">
              forward
            </div>
            <div class="code-name">.icon-forward
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-fast-forward"></span>
            <div class="name">
              fast-forward
            </div>
            <div class="code-name">.icon-fast-forward
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-search"></span>
            <div class="name">
              search
            </div>
            <div class="code-name">.icon-search
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-retweet"></span>
            <div class="name">
              retweet
            </div>
            <div class="code-name">.icon-retweet
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-login"></span>
            <div class="name">
              login
            </div>
            <div class="code-name">.icon-login
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-step-backward"></span>
            <div class="name">
              step-backward
            </div>
            <div class="code-name">.icon-step-backward
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-step-forward"></span>
            <div class="name">
              step-forward
            </div>
            <div class="code-name">.icon-step-forward
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-swap-right"></span>
            <div class="name">
              swap-right
            </div>
            <div class="code-name">.icon-swap-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-swap-left"></span>
            <div class="name">
              swap-left
            </div>
            <div class="code-name">.icon-swap-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon andesign icon-woman"></span>
            <div class="name">
              woman
            </div>
            <div class="code-name">.icon-woman
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="andesign icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            andesign" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-check-circle"></use>
                </svg>
                <div class="name">check-circle</div>
                <div class="code-name">#icon-check-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-CI"></use>
                </svg>
                <div class="name">CI</div>
                <div class="code-name">#icon-CI</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Dollar"></use>
                </svg>
                <div class="name">Dollar</div>
                <div class="code-name">#icon-Dollar</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-compass"></use>
                </svg>
                <div class="name">compass</div>
                <div class="code-name">#icon-compass</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close-circle"></use>
                </svg>
                <div class="name">close-circle</div>
                <div class="code-name">#icon-close-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-frown"></use>
                </svg>
                <div class="name">frown</div>
                <div class="code-name">#icon-frown</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-info-circle"></use>
                </svg>
                <div class="name">info-circle</div>
                <div class="code-name">#icon-info-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-left-circle"></use>
                </svg>
                <div class="name">left-circle</div>
                <div class="code-name">#icon-left-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down-circle"></use>
                </svg>
                <div class="name">down-circle</div>
                <div class="code-name">#icon-down-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-EURO"></use>
                </svg>
                <div class="name">EURO</div>
                <div class="code-name">#icon-EURO</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-copyright"></use>
                </svg>
                <div class="name">copyright</div>
                <div class="code-name">#icon-copyright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-minus-circle"></use>
                </svg>
                <div class="name">minus-circle</div>
                <div class="code-name">#icon-minus-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-meh"></use>
                </svg>
                <div class="name">meh</div>
                <div class="code-name">#icon-meh</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-plus-circle"></use>
                </svg>
                <div class="name">plus-circle</div>
                <div class="code-name">#icon-plus-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-play-circle"></use>
                </svg>
                <div class="name">play-circle</div>
                <div class="code-name">#icon-play-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-question-circle"></use>
                </svg>
                <div class="name">question-circle</div>
                <div class="code-name">#icon-question-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Pound"></use>
                </svg>
                <div class="name">Pound</div>
                <div class="code-name">#icon-Pound</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-right-circle"></use>
                </svg>
                <div class="name">right-circle</div>
                <div class="code-name">#icon-right-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-smile"></use>
                </svg>
                <div class="name">smile</div>
                <div class="code-name">#icon-smile</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-trademark"></use>
                </svg>
                <div class="name">trademark</div>
                <div class="code-name">#icon-trademark</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-time-circle"></use>
                </svg>
                <div class="name">time-circle</div>
                <div class="code-name">#icon-time-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-timeout"></use>
                </svg>
                <div class="name">time out</div>
                <div class="code-name">#icon-timeout</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-earth"></use>
                </svg>
                <div class="name">earth</div>
                <div class="code-name">#icon-earth</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-YUAN"></use>
                </svg>
                <div class="name">YUAN</div>
                <div class="code-name">#icon-YUAN</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-up-circle"></use>
                </svg>
                <div class="name">up-circle</div>
                <div class="code-name">#icon-up-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-warning-circle"></use>
                </svg>
                <div class="name">warning-circle</div>
                <div class="code-name">#icon-warning-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sync"></use>
                </svg>
                <div class="name">sync</div>
                <div class="code-name">#icon-sync</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-transaction"></use>
                </svg>
                <div class="name">transaction</div>
                <div class="code-name">#icon-transaction</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-undo"></use>
                </svg>
                <div class="name">undo</div>
                <div class="code-name">#icon-undo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-redo"></use>
                </svg>
                <div class="name">redo</div>
                <div class="code-name">#icon-redo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reload"></use>
                </svg>
                <div class="name">reload</div>
                <div class="code-name">#icon-reload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reloadtime"></use>
                </svg>
                <div class="name">reload time</div>
                <div class="code-name">#icon-reloadtime</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-message"></use>
                </svg>
                <div class="name">message</div>
                <div class="code-name">#icon-message</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dashboard"></use>
                </svg>
                <div class="name">dashboard</div>
                <div class="code-name">#icon-dashboard</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-issuesclose"></use>
                </svg>
                <div class="name">issues close</div>
                <div class="code-name">#icon-issuesclose</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-poweroff"></use>
                </svg>
                <div class="name">poweroff</div>
                <div class="code-name">#icon-poweroff</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-logout"></use>
                </svg>
                <div class="name">logout</div>
                <div class="code-name">#icon-logout</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-piechart"></use>
                </svg>
                <div class="name">pie chart</div>
                <div class="code-name">#icon-piechart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-setting"></use>
                </svg>
                <div class="name">setting</div>
                <div class="code-name">#icon-setting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-eye"></use>
                </svg>
                <div class="name">eye</div>
                <div class="code-name">#icon-eye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-location"></use>
                </svg>
                <div class="name">location</div>
                <div class="code-name">#icon-location</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-edit-square"></use>
                </svg>
                <div class="name">edit-square</div>
                <div class="code-name">#icon-edit-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-export"></use>
                </svg>
                <div class="name">export</div>
                <div class="code-name">#icon-export</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-save"></use>
                </svg>
                <div class="name">save</div>
                <div class="code-name">#icon-save</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Import"></use>
                </svg>
                <div class="name">Import</div>
                <div class="code-name">#icon-Import</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-appstore"></use>
                </svg>
                <div class="name">app store</div>
                <div class="code-name">#icon-appstore</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close-square"></use>
                </svg>
                <div class="name">close-square</div>
                <div class="code-name">#icon-close-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down-square"></use>
                </svg>
                <div class="name">down-square</div>
                <div class="code-name">#icon-down-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-layout"></use>
                </svg>
                <div class="name">layout</div>
                <div class="code-name">#icon-layout</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-left-square"></use>
                </svg>
                <div class="name">left-square</div>
                <div class="code-name">#icon-left-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-play-square"></use>
                </svg>
                <div class="name">play-square</div>
                <div class="code-name">#icon-play-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-control"></use>
                </svg>
                <div class="name">control</div>
                <div class="code-name">#icon-control</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-codelibrary"></use>
                </svg>
                <div class="name">code library</div>
                <div class="code-name">#icon-codelibrary</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-detail"></use>
                </svg>
                <div class="name">detail</div>
                <div class="code-name">#icon-detail</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-minus-square"></use>
                </svg>
                <div class="name">minus-square</div>
                <div class="code-name">#icon-minus-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-plus-square"></use>
                </svg>
                <div class="name">plus-square</div>
                <div class="code-name">#icon-plus-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-right-square"></use>
                </svg>
                <div class="name">right-square</div>
                <div class="code-name">#icon-right-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-project"></use>
                </svg>
                <div class="name">project</div>
                <div class="code-name">#icon-project</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wallet"></use>
                </svg>
                <div class="name">wallet</div>
                <div class="code-name">#icon-wallet</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-up-square"></use>
                </svg>
                <div class="name">up-square</div>
                <div class="code-name">#icon-up-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calculator"></use>
                </svg>
                <div class="name">calculator</div>
                <div class="code-name">#icon-calculator</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-interation"></use>
                </svg>
                <div class="name">interation</div>
                <div class="code-name">#icon-interation</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-check-square"></use>
                </svg>
                <div class="name">check-square</div>
                <div class="code-name">#icon-check-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border"></use>
                </svg>
                <div class="name">border</div>
                <div class="code-name">#icon-border</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-outer"></use>
                </svg>
                <div class="name">border-outer</div>
                <div class="code-name">#icon-border-outer</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-top"></use>
                </svg>
                <div class="name">border-top</div>
                <div class="code-name">#icon-border-top</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-bottom"></use>
                </svg>
                <div class="name">border-bottom</div>
                <div class="code-name">#icon-border-bottom</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-left"></use>
                </svg>
                <div class="name">border-left</div>
                <div class="code-name">#icon-border-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-right"></use>
                </svg>
                <div class="name">border-right</div>
                <div class="code-name">#icon-border-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-inner"></use>
                </svg>
                <div class="name">border-inner</div>
                <div class="code-name">#icon-border-inner</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-verticle"></use>
                </svg>
                <div class="name">border-verticle</div>
                <div class="code-name">#icon-border-verticle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-border-horizontal"></use>
                </svg>
                <div class="name">border-horizontal</div>
                <div class="code-name">#icon-border-horizontal</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-radius-bottomleft"></use>
                </svg>
                <div class="name">radius-bottomleft</div>
                <div class="code-name">#icon-radius-bottomleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-radius-bottomright"></use>
                </svg>
                <div class="name">radius-bottomright</div>
                <div class="code-name">#icon-radius-bottomright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-radius-upleft"></use>
                </svg>
                <div class="name">radius-upleft</div>
                <div class="code-name">#icon-radius-upleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-radius-upright"></use>
                </svg>
                <div class="name">radius-upright</div>
                <div class="code-name">#icon-radius-upright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-radius-setting"></use>
                </svg>
                <div class="name">radius-setting</div>
                <div class="code-name">#icon-radius-setting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-adduser"></use>
                </svg>
                <div class="name">add user</div>
                <div class="code-name">#icon-adduser</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-deleteteam"></use>
                </svg>
                <div class="name">delete team</div>
                <div class="code-name">#icon-deleteteam</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-deleteuser"></use>
                </svg>
                <div class="name">delete user</div>
                <div class="code-name">#icon-deleteuser</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-addteam"></use>
                </svg>
                <div class="name">addteam</div>
                <div class="code-name">#icon-addteam</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-user"></use>
                </svg>
                <div class="name">user</div>
                <div class="code-name">#icon-user</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-team"></use>
                </svg>
                <div class="name">team</div>
                <div class="code-name">#icon-team</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-areachart"></use>
                </svg>
                <div class="name">area chart</div>
                <div class="code-name">#icon-areachart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-linechart"></use>
                </svg>
                <div class="name">line chart</div>
                <div class="code-name">#icon-linechart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-barchart"></use>
                </svg>
                <div class="name">bar chart</div>
                <div class="code-name">#icon-barchart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pointmap"></use>
                </svg>
                <div class="name">point map</div>
                <div class="code-name">#icon-pointmap</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-container"></use>
                </svg>
                <div class="name">container</div>
                <div class="code-name">#icon-container</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-database"></use>
                </svg>
                <div class="name">database</div>
                <div class="code-name">#icon-database</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sever"></use>
                </svg>
                <div class="name">sever</div>
                <div class="code-name">#icon-sever</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mobile"></use>
                </svg>
                <div class="name">mobile</div>
                <div class="code-name">#icon-mobile</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tablet"></use>
                </svg>
                <div class="name">tablet</div>
                <div class="code-name">#icon-tablet</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-redenvelope"></use>
                </svg>
                <div class="name">red envelope</div>
                <div class="code-name">#icon-redenvelope</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-book"></use>
                </svg>
                <div class="name">book</div>
                <div class="code-name">#icon-book</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-filedone"></use>
                </svg>
                <div class="name">file done</div>
                <div class="code-name">#icon-filedone</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reconciliation"></use>
                </svg>
                <div class="name">reconciliation</div>
                <div class="code-name">#icon-reconciliation</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-exception"></use>
                </svg>
                <div class="name">file -exception</div>
                <div class="code-name">#icon-file-exception</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-filesync"></use>
                </svg>
                <div class="name">file sync</div>
                <div class="code-name">#icon-filesync</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-filesearch"></use>
                </svg>
                <div class="name">file search</div>
                <div class="code-name">#icon-filesearch</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-solution"></use>
                </svg>
                <div class="name">solution</div>
                <div class="code-name">#icon-solution</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fileprotect"></use>
                </svg>
                <div class="name">file protect</div>
                <div class="code-name">#icon-fileprotect</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-add"></use>
                </svg>
                <div class="name">file-add</div>
                <div class="code-name">#icon-file-add</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-excel"></use>
                </svg>
                <div class="name">file-excel</div>
                <div class="code-name">#icon-file-excel</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-exclamation"></use>
                </svg>
                <div class="name">file-exclamation</div>
                <div class="code-name">#icon-file-exclamation</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-pdf"></use>
                </svg>
                <div class="name">file-pdf</div>
                <div class="code-name">#icon-file-pdf</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-image"></use>
                </svg>
                <div class="name">file-image</div>
                <div class="code-name">#icon-file-image</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-markdown"></use>
                </svg>
                <div class="name">file-markdown</div>
                <div class="code-name">#icon-file-markdown</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-unknown"></use>
                </svg>
                <div class="name">file-unknown</div>
                <div class="code-name">#icon-file-unknown</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-ppt"></use>
                </svg>
                <div class="name">file-ppt</div>
                <div class="code-name">#icon-file-ppt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-word"></use>
                </svg>
                <div class="name">file-word</div>
                <div class="code-name">#icon-file-word</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file"></use>
                </svg>
                <div class="name">file</div>
                <div class="code-name">#icon-file</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-zip"></use>
                </svg>
                <div class="name">file-zip</div>
                <div class="code-name">#icon-file-zip</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-text"></use>
                </svg>
                <div class="name">file-text</div>
                <div class="code-name">#icon-file-text</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-copy"></use>
                </svg>
                <div class="name">file-copy</div>
                <div class="code-name">#icon-file-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-snippets"></use>
                </svg>
                <div class="name">snippets</div>
                <div class="code-name">#icon-snippets</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-audit"></use>
                </svg>
                <div class="name">audit</div>
                <div class="code-name">#icon-audit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-diff"></use>
                </svg>
                <div class="name">diff</div>
                <div class="code-name">#icon-diff</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Batchfolding"></use>
                </svg>
                <div class="name">Batch folding</div>
                <div class="code-name">#icon-Batchfolding</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-securityscan"></use>
                </svg>
                <div class="name">security scan</div>
                <div class="code-name">#icon-securityscan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-propertysafety"></use>
                </svg>
                <div class="name">property safety</div>
                <div class="code-name">#icon-propertysafety</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-safetycertificate"></use>
                </svg>
                <div class="name">safety certificate</div>
                <div class="code-name">#icon-safetycertificate</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-insurance"></use>
                </svg>
                <div class="name">insurance </div>
                <div class="code-name">#icon-insurance</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alert"></use>
                </svg>
                <div class="name">alert</div>
                <div class="code-name">#icon-alert</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-delete"></use>
                </svg>
                <div class="name">delete</div>
                <div class="code-name">#icon-delete</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-hourglass"></use>
                </svg>
                <div class="name">hourglass</div>
                <div class="code-name">#icon-hourglass</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bulb"></use>
                </svg>
                <div class="name">bulb</div>
                <div class="code-name">#icon-bulb</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-experiment"></use>
                </svg>
                <div class="name">experiment</div>
                <div class="code-name">#icon-experiment</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bell"></use>
                </svg>
                <div class="name">bell</div>
                <div class="code-name">#icon-bell</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-trophy"></use>
                </svg>
                <div class="name">trophy</div>
                <div class="code-name">#icon-trophy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rest"></use>
                </svg>
                <div class="name">rest</div>
                <div class="code-name">#icon-rest</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-USB"></use>
                </svg>
                <div class="name">USB</div>
                <div class="code-name">#icon-USB</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-skin"></use>
                </svg>
                <div class="name">skin</div>
                <div class="code-name">#icon-skin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-home"></use>
                </svg>
                <div class="name">home</div>
                <div class="code-name">#icon-home</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bank"></use>
                </svg>
                <div class="name">bank</div>
                <div class="code-name">#icon-bank</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-filter"></use>
                </svg>
                <div class="name">filter</div>
                <div class="code-name">#icon-filter</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-funnelplot"></use>
                </svg>
                <div class="name">funnel plot</div>
                <div class="code-name">#icon-funnelplot</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-like"></use>
                </svg>
                <div class="name">like</div>
                <div class="code-name">#icon-like</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-unlike"></use>
                </svg>
                <div class="name">unlike</div>
                <div class="code-name">#icon-unlike</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-unlock"></use>
                </svg>
                <div class="name">unlock</div>
                <div class="code-name">#icon-unlock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lock"></use>
                </svg>
                <div class="name">lock</div>
                <div class="code-name">#icon-lock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-customerservice"></use>
                </svg>
                <div class="name">customerservice</div>
                <div class="code-name">#icon-customerservice</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-flag"></use>
                </svg>
                <div class="name">flag</div>
                <div class="code-name">#icon-flag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-moneycollect"></use>
                </svg>
                <div class="name">money collect</div>
                <div class="code-name">#icon-moneycollect</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-medicinebox"></use>
                </svg>
                <div class="name">medicinebox</div>
                <div class="code-name">#icon-medicinebox</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shop"></use>
                </svg>
                <div class="name">shop</div>
                <div class="code-name">#icon-shop</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rocket"></use>
                </svg>
                <div class="name">rocket</div>
                <div class="code-name">#icon-rocket</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shopping"></use>
                </svg>
                <div class="name">shopping</div>
                <div class="code-name">#icon-shopping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-folder"></use>
                </svg>
                <div class="name">folder</div>
                <div class="code-name">#icon-folder</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-folder-open"></use>
                </svg>
                <div class="name">folder-open</div>
                <div class="code-name">#icon-folder-open</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-folder-add"></use>
                </svg>
                <div class="name">folder-add</div>
                <div class="code-name">#icon-folder-add</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-deploymentunit"></use>
                </svg>
                <div class="name">deployment unit</div>
                <div class="code-name">#icon-deploymentunit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-accountbook"></use>
                </svg>
                <div class="name">account book</div>
                <div class="code-name">#icon-accountbook</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-contacts"></use>
                </svg>
                <div class="name">contacts</div>
                <div class="code-name">#icon-contacts</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-carryout"></use>
                </svg>
                <div class="name">carry out</div>
                <div class="code-name">#icon-carryout</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calendar-check"></use>
                </svg>
                <div class="name">calendar-check</div>
                <div class="code-name">#icon-calendar-check</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calendar"></use>
                </svg>
                <div class="name">calendar</div>
                <div class="code-name">#icon-calendar</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-scan"></use>
                </svg>
                <div class="name">scan</div>
                <div class="code-name">#icon-scan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-select"></use>
                </svg>
                <div class="name">select</div>
                <div class="code-name">#icon-select</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-boxplot"></use>
                </svg>
                <div class="name">box plot</div>
                <div class="code-name">#icon-boxplot</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-build"></use>
                </svg>
                <div class="name">build</div>
                <div class="code-name">#icon-build</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sliders"></use>
                </svg>
                <div class="name">sliders</div>
                <div class="code-name">#icon-sliders</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-laptop"></use>
                </svg>
                <div class="name">laptop</div>
                <div class="code-name">#icon-laptop</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-barcode"></use>
                </svg>
                <div class="name">barcode</div>
                <div class="code-name">#icon-barcode</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-camera"></use>
                </svg>
                <div class="name">camera</div>
                <div class="code-name">#icon-camera</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cluster"></use>
                </svg>
                <div class="name">cluster</div>
                <div class="code-name">#icon-cluster</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gateway"></use>
                </svg>
                <div class="name">gateway</div>
                <div class="code-name">#icon-gateway</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-car"></use>
                </svg>
                <div class="name">car</div>
                <div class="code-name">#icon-car</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-printer"></use>
                </svg>
                <div class="name">printer</div>
                <div class="code-name">#icon-printer</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-read"></use>
                </svg>
                <div class="name">read</div>
                <div class="code-name">#icon-read</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cloud-server"></use>
                </svg>
                <div class="name">cloud-server</div>
                <div class="code-name">#icon-cloud-server</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cloud-upload"></use>
                </svg>
                <div class="name">cloud-upload</div>
                <div class="code-name">#icon-cloud-upload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cloud"></use>
                </svg>
                <div class="name">cloud</div>
                <div class="code-name">#icon-cloud</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cloud-download"></use>
                </svg>
                <div class="name">cloud-download</div>
                <div class="code-name">#icon-cloud-download</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cloud-sync"></use>
                </svg>
                <div class="name">cloud-sync</div>
                <div class="code-name">#icon-cloud-sync</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-video"></use>
                </svg>
                <div class="name">video</div>
                <div class="code-name">#icon-video</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-notification"></use>
                </svg>
                <div class="name">notification</div>
                <div class="code-name">#icon-notification</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sound"></use>
                </svg>
                <div class="name">sound</div>
                <div class="code-name">#icon-sound</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-radarchart"></use>
                </svg>
                <div class="name">radar chart</div>
                <div class="code-name">#icon-radarchart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qrcode"></use>
                </svg>
                <div class="name">qrcode</div>
                <div class="code-name">#icon-qrcode</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fund"></use>
                </svg>
                <div class="name">fund</div>
                <div class="code-name">#icon-fund</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-image"></use>
                </svg>
                <div class="name">image</div>
                <div class="code-name">#icon-image</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mail"></use>
                </svg>
                <div class="name">mail</div>
                <div class="code-name">#icon-mail</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-table"></use>
                </svg>
                <div class="name">table</div>
                <div class="code-name">#icon-table</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-idcard"></use>
                </svg>
                <div class="name">id card</div>
                <div class="code-name">#icon-idcard</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-creditcard"></use>
                </svg>
                <div class="name">credit card</div>
                <div class="code-name">#icon-creditcard</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-heart"></use>
                </svg>
                <div class="name">heart</div>
                <div class="code-name">#icon-heart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-block"></use>
                </svg>
                <div class="name">block</div>
                <div class="code-name">#icon-block</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-error"></use>
                </svg>
                <div class="name">error</div>
                <div class="code-name">#icon-error</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-star"></use>
                </svg>
                <div class="name">star</div>
                <div class="code-name">#icon-star</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gold"></use>
                </svg>
                <div class="name">gold</div>
                <div class="code-name">#icon-gold</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-heatmap"></use>
                </svg>
                <div class="name">heat map</div>
                <div class="code-name">#icon-heatmap</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wifi"></use>
                </svg>
                <div class="name">wifi</div>
                <div class="code-name">#icon-wifi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-attachment"></use>
                </svg>
                <div class="name">attachment</div>
                <div class="code-name">#icon-attachment</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-edit"></use>
                </svg>
                <div class="name">edit</div>
                <div class="code-name">#icon-edit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-key"></use>
                </svg>
                <div class="name">key</div>
                <div class="code-name">#icon-key</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-api"></use>
                </svg>
                <div class="name">api</div>
                <div class="code-name">#icon-api</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-disconnect"></use>
                </svg>
                <div class="name">disconnect</div>
                <div class="code-name">#icon-disconnect</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-highlight"></use>
                </svg>
                <div class="name">highlight</div>
                <div class="code-name">#icon-highlight</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-monitor"></use>
                </svg>
                <div class="name">monitor</div>
                <div class="code-name">#icon-monitor</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-link"></use>
                </svg>
                <div class="name">link</div>
                <div class="code-name">#icon-link</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-man"></use>
                </svg>
                <div class="name">man</div>
                <div class="code-name">#icon-man</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-percentage"></use>
                </svg>
                <div class="name">percentage</div>
                <div class="code-name">#icon-percentage</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pushpin"></use>
                </svg>
                <div class="name">pushpin</div>
                <div class="code-name">#icon-pushpin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-phone"></use>
                </svg>
                <div class="name">phone</div>
                <div class="code-name">#icon-phone</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shake"></use>
                </svg>
                <div class="name">shake</div>
                <div class="code-name">#icon-shake</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tag"></use>
                </svg>
                <div class="name">tag</div>
                <div class="code-name">#icon-tag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wrench"></use>
                </svg>
                <div class="name">wrench</div>
                <div class="code-name">#icon-wrench</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tags"></use>
                </svg>
                <div class="name">tags</div>
                <div class="code-name">#icon-tags</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-scissor"></use>
                </svg>
                <div class="name">scissor</div>
                <div class="code-name">#icon-scissor</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mr"></use>
                </svg>
                <div class="name">mr</div>
                <div class="code-name">#icon-mr</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-share"></use>
                </svg>
                <div class="name">share</div>
                <div class="code-name">#icon-share</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-branches"></use>
                </svg>
                <div class="name">branches</div>
                <div class="code-name">#icon-branches</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fork"></use>
                </svg>
                <div class="name">fork</div>
                <div class="code-name">#icon-fork</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shrink"></use>
                </svg>
                <div class="name">shrink</div>
                <div class="code-name">#icon-shrink</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrawsalt"></use>
                </svg>
                <div class="name">arrawsalt</div>
                <div class="code-name">#icon-arrawsalt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-verticalright"></use>
                </svg>
                <div class="name">vertical right</div>
                <div class="code-name">#icon-verticalright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-verticalleft"></use>
                </svg>
                <div class="name">vertical left</div>
                <div class="code-name">#icon-verticalleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-right"></use>
                </svg>
                <div class="name">right</div>
                <div class="code-name">#icon-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-left"></use>
                </svg>
                <div class="name">left</div>
                <div class="code-name">#icon-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-up"></use>
                </svg>
                <div class="name">up</div>
                <div class="code-name">#icon-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down"></use>
                </svg>
                <div class="name">down</div>
                <div class="code-name">#icon-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fullscreen"></use>
                </svg>
                <div class="name">fullscreen</div>
                <div class="code-name">#icon-fullscreen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fullscreen-exit"></use>
                </svg>
                <div class="name">fullscreen-exit</div>
                <div class="code-name">#icon-fullscreen-exit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-doubleleft"></use>
                </svg>
                <div class="name">doubleleft</div>
                <div class="code-name">#icon-doubleleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-doubleright"></use>
                </svg>
                <div class="name">double right</div>
                <div class="code-name">#icon-doubleright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrowright"></use>
                </svg>
                <div class="name">arrowright</div>
                <div class="code-name">#icon-arrowright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrowup"></use>
                </svg>
                <div class="name">arrowup</div>
                <div class="code-name">#icon-arrowup</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrowleft"></use>
                </svg>
                <div class="name">arrowleft</div>
                <div class="code-name">#icon-arrowleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrowdown"></use>
                </svg>
                <div class="name">arrowdown</div>
                <div class="code-name">#icon-arrowdown</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-upload"></use>
                </svg>
                <div class="name">upload</div>
                <div class="code-name">#icon-upload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-colum-height"></use>
                </svg>
                <div class="name">colum-height</div>
                <div class="code-name">#icon-colum-height</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-vertical-align-botto"></use>
                </svg>
                <div class="name">vertical-align-botto</div>
                <div class="code-name">#icon-vertical-align-botto</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-vertical-align-middl"></use>
                </svg>
                <div class="name">vertical-align-middl</div>
                <div class="code-name">#icon-vertical-align-middl</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-totop"></use>
                </svg>
                <div class="name">totop</div>
                <div class="code-name">#icon-totop</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-vertical-align-top"></use>
                </svg>
                <div class="name">vertical-align-top</div>
                <div class="code-name">#icon-vertical-align-top</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-download"></use>
                </svg>
                <div class="name">download</div>
                <div class="code-name">#icon-download</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sort-descending"></use>
                </svg>
                <div class="name">sort-descending</div>
                <div class="code-name">#icon-sort-descending</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sort-ascending"></use>
                </svg>
                <div class="name">sort-ascending</div>
                <div class="code-name">#icon-sort-ascending</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fall"></use>
                </svg>
                <div class="name">fall</div>
                <div class="code-name">#icon-fall</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-swap"></use>
                </svg>
                <div class="name">swap</div>
                <div class="code-name">#icon-swap</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-stock"></use>
                </svg>
                <div class="name">stock</div>
                <div class="code-name">#icon-stock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rise"></use>
                </svg>
                <div class="name">rise</div>
                <div class="code-name">#icon-rise</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-indent"></use>
                </svg>
                <div class="name">indent</div>
                <div class="code-name">#icon-indent</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-outdent"></use>
                </svg>
                <div class="name">outdent</div>
                <div class="code-name">#icon-outdent</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu"></use>
                </svg>
                <div class="name">menu</div>
                <div class="code-name">#icon-menu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-unorderedlist"></use>
                </svg>
                <div class="name">unordered list</div>
                <div class="code-name">#icon-unorderedlist</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-orderedlist"></use>
                </svg>
                <div class="name">ordered list</div>
                <div class="code-name">#icon-orderedlist</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-align-right"></use>
                </svg>
                <div class="name">align-right</div>
                <div class="code-name">#icon-align-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-align-center"></use>
                </svg>
                <div class="name">align-center</div>
                <div class="code-name">#icon-align-center</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-align-left"></use>
                </svg>
                <div class="name">align-left</div>
                <div class="code-name">#icon-align-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pic-center"></use>
                </svg>
                <div class="name">pic-center</div>
                <div class="code-name">#icon-pic-center</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pic-right"></use>
                </svg>
                <div class="name">pic-right</div>
                <div class="code-name">#icon-pic-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pic-left"></use>
                </svg>
                <div class="name">pic-left</div>
                <div class="code-name">#icon-pic-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bold"></use>
                </svg>
                <div class="name">bold</div>
                <div class="code-name">#icon-bold</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-font-colors"></use>
                </svg>
                <div class="name">font-colors</div>
                <div class="code-name">#icon-font-colors</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-exclaimination"></use>
                </svg>
                <div class="name">exclaimination</div>
                <div class="code-name">#icon-exclaimination</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-font-size"></use>
                </svg>
                <div class="name">font-size</div>
                <div class="code-name">#icon-font-size</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-infomation"></use>
                </svg>
                <div class="name">infomation</div>
                <div class="code-name">#icon-infomation</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-line-height"></use>
                </svg>
                <div class="name">line-height</div>
                <div class="code-name">#icon-line-height</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-strikethrough"></use>
                </svg>
                <div class="name">strikethrough</div>
                <div class="code-name">#icon-strikethrough</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-underline"></use>
                </svg>
                <div class="name">underline</div>
                <div class="code-name">#icon-underline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-number"></use>
                </svg>
                <div class="name">number</div>
                <div class="code-name">#icon-number</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-italic"></use>
                </svg>
                <div class="name">italic</div>
                <div class="code-name">#icon-italic</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-code"></use>
                </svg>
                <div class="name">code</div>
                <div class="code-name">#icon-code</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-column-width"></use>
                </svg>
                <div class="name">column-width</div>
                <div class="code-name">#icon-column-width</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-check"></use>
                </svg>
                <div class="name">check</div>
                <div class="code-name">#icon-check</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ellipsis"></use>
                </svg>
                <div class="name">ellipsis</div>
                <div class="code-name">#icon-ellipsis</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dash"></use>
                </svg>
                <div class="name">dash</div>
                <div class="code-name">#icon-dash</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close"></use>
                </svg>
                <div class="name">close</div>
                <div class="code-name">#icon-close</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-enter"></use>
                </svg>
                <div class="name">enter</div>
                <div class="code-name">#icon-enter</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-line"></use>
                </svg>
                <div class="name">line</div>
                <div class="code-name">#icon-line</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-minus"></use>
                </svg>
                <div class="name">minus</div>
                <div class="code-name">#icon-minus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-question"></use>
                </svg>
                <div class="name">question</div>
                <div class="code-name">#icon-question</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-plus"></use>
                </svg>
                <div class="name">plus</div>
                <div class="code-name">#icon-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rollback"></use>
                </svg>
                <div class="name">rollback</div>
                <div class="code-name">#icon-rollback</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-small-dash"></use>
                </svg>
                <div class="name">small-dash</div>
                <div class="code-name">#icon-small-dash</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pause"></use>
                </svg>
                <div class="name">pause</div>
                <div class="code-name">#icon-pause</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bg-colors"></use>
                </svg>
                <div class="name">bg-colors</div>
                <div class="code-name">#icon-bg-colors</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-crown"></use>
                </svg>
                <div class="name">crown</div>
                <div class="code-name">#icon-crown</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-drag"></use>
                </svg>
                <div class="name">drag</div>
                <div class="code-name">#icon-drag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-desktop"></use>
                </svg>
                <div class="name">desktop</div>
                <div class="code-name">#icon-desktop</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gift"></use>
                </svg>
                <div class="name">gift</div>
                <div class="code-name">#icon-gift</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-stop"></use>
                </svg>
                <div class="name">stop</div>
                <div class="code-name">#icon-stop</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fire"></use>
                </svg>
                <div class="name">fire</div>
                <div class="code-name">#icon-fire</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-thunderbolt"></use>
                </svg>
                <div class="name">thunderbolt</div>
                <div class="code-name">#icon-thunderbolt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-check-circle-fill"></use>
                </svg>
                <div class="name">check-circle-fill</div>
                <div class="code-name">#icon-check-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-left-circle-fill"></use>
                </svg>
                <div class="name">left-circle-fill</div>
                <div class="code-name">#icon-left-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down-circle-fill"></use>
                </svg>
                <div class="name">down-circle-fill</div>
                <div class="code-name">#icon-down-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-minus-circle-fill"></use>
                </svg>
                <div class="name">minus-circle-fill</div>
                <div class="code-name">#icon-minus-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close-circle-fill"></use>
                </svg>
                <div class="name">close-circle-fill</div>
                <div class="code-name">#icon-close-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-info-circle-fill"></use>
                </svg>
                <div class="name">info-circle-fill</div>
                <div class="code-name">#icon-info-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-up-circle-fill"></use>
                </svg>
                <div class="name">up-circle-fill</div>
                <div class="code-name">#icon-up-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-right-circle-fill"></use>
                </svg>
                <div class="name">right-circle-fill</div>
                <div class="code-name">#icon-right-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-plus-circle-fill"></use>
                </svg>
                <div class="name">plus-circle-fill</div>
                <div class="code-name">#icon-plus-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-question-circle-fill"></use>
                </svg>
                <div class="name">question-circle-fill</div>
                <div class="code-name">#icon-question-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-EURO-circle-fill"></use>
                </svg>
                <div class="name">EURO-circle-fill</div>
                <div class="code-name">#icon-EURO-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-frown-fill"></use>
                </svg>
                <div class="name">frown-fill</div>
                <div class="code-name">#icon-frown-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-copyright-circle-fil"></use>
                </svg>
                <div class="name">copyright-circle-fil</div>
                <div class="code-name">#icon-copyright-circle-fil</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-CI-circle-fill"></use>
                </svg>
                <div class="name">CI-circle-fill</div>
                <div class="code-name">#icon-CI-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-compass-fill"></use>
                </svg>
                <div class="name">compass-fill</div>
                <div class="code-name">#icon-compass-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Dollar-circle-fill"></use>
                </svg>
                <div class="name">Dollar-circle-fill</div>
                <div class="code-name">#icon-Dollar-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-poweroff-circle-fill"></use>
                </svg>
                <div class="name">poweroff-circle-fill</div>
                <div class="code-name">#icon-poweroff-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-meh-fill"></use>
                </svg>
                <div class="name">meh-fill</div>
                <div class="code-name">#icon-meh-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-play-circle-fill"></use>
                </svg>
                <div class="name">play-circle-fill</div>
                <div class="code-name">#icon-play-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Pound-circle-fill"></use>
                </svg>
                <div class="name">Pound-circle-fill</div>
                <div class="code-name">#icon-Pound-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-smile-fill"></use>
                </svg>
                <div class="name">smile-fill</div>
                <div class="code-name">#icon-smile-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-stop-fill"></use>
                </svg>
                <div class="name">stop-fill</div>
                <div class="code-name">#icon-stop-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-warning-circle-fill"></use>
                </svg>
                <div class="name">warning-circle-fill</div>
                <div class="code-name">#icon-warning-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-time-circle-fill"></use>
                </svg>
                <div class="name">time-circle-fill</div>
                <div class="code-name">#icon-time-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-trademark-circle-fil"></use>
                </svg>
                <div class="name">trademark-circle-fil</div>
                <div class="code-name">#icon-trademark-circle-fil</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-YUAN-circle-fill"></use>
                </svg>
                <div class="name">YUAN-circle-fill</div>
                <div class="code-name">#icon-YUAN-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-heart-fill"></use>
                </svg>
                <div class="name">heart-fill</div>
                <div class="code-name">#icon-heart-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-piechart-circle-fil"></use>
                </svg>
                <div class="name">pie chart-circle-fil</div>
                <div class="code-name">#icon-piechart-circle-fil</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dashboard-fill"></use>
                </svg>
                <div class="name">dashboard-fill</div>
                <div class="code-name">#icon-dashboard-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-message-fill"></use>
                </svg>
                <div class="name">message-fill</div>
                <div class="code-name">#icon-message-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-check-square-fill"></use>
                </svg>
                <div class="name">check-square-fill</div>
                <div class="code-name">#icon-check-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down-square-fill"></use>
                </svg>
                <div class="name">down-square-fill</div>
                <div class="code-name">#icon-down-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-minus-square-fill"></use>
                </svg>
                <div class="name">minus-square-fill</div>
                <div class="code-name">#icon-minus-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close-square-fill"></use>
                </svg>
                <div class="name">close-square-fill</div>
                <div class="code-name">#icon-close-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-codelibrary-fill"></use>
                </svg>
                <div class="name">code library-fill</div>
                <div class="code-name">#icon-codelibrary-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-left-square-fill"></use>
                </svg>
                <div class="name">left-square-fill</div>
                <div class="code-name">#icon-left-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-play-square-fill"></use>
                </svg>
                <div class="name">play-square-fill</div>
                <div class="code-name">#icon-play-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-up-square-fill"></use>
                </svg>
                <div class="name">up-square-fill</div>
                <div class="code-name">#icon-up-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-right-square-fill"></use>
                </svg>
                <div class="name">right-square-fill</div>
                <div class="code-name">#icon-right-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-plus-square-fill"></use>
                </svg>
                <div class="name">plus-square-fill</div>
                <div class="code-name">#icon-plus-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-accountbook-fill"></use>
                </svg>
                <div class="name">account book-fill</div>
                <div class="code-name">#icon-accountbook-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-carryout-fill"></use>
                </svg>
                <div class="name">carry out-fill</div>
                <div class="code-name">#icon-carryout-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calendar-fill"></use>
                </svg>
                <div class="name">calendar-fill</div>
                <div class="code-name">#icon-calendar-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calculator-fill"></use>
                </svg>
                <div class="name">calculator-fill</div>
                <div class="code-name">#icon-calculator-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-interation-fill"></use>
                </svg>
                <div class="name">interation-fill</div>
                <div class="code-name">#icon-interation-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-project-fill"></use>
                </svg>
                <div class="name">project-fill</div>
                <div class="code-name">#icon-project-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-detail-fill"></use>
                </svg>
                <div class="name">detail-fill</div>
                <div class="code-name">#icon-detail-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-save-fill"></use>
                </svg>
                <div class="name">save-fill</div>
                <div class="code-name">#icon-save-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wallet-fill"></use>
                </svg>
                <div class="name">wallet-fill</div>
                <div class="code-name">#icon-wallet-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-control-fill"></use>
                </svg>
                <div class="name">control-fill</div>
                <div class="code-name">#icon-control-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-layout-fill"></use>
                </svg>
                <div class="name">layout-fill</div>
                <div class="code-name">#icon-layout-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-appstore-fill"></use>
                </svg>
                <div class="name">app store-fill</div>
                <div class="code-name">#icon-appstore-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mobile-fill"></use>
                </svg>
                <div class="name">mobile-fill</div>
                <div class="code-name">#icon-mobile-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tablet-fill"></use>
                </svg>
                <div class="name">tablet-fill</div>
                <div class="code-name">#icon-tablet-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-book-fill"></use>
                </svg>
                <div class="name">book-fill</div>
                <div class="code-name">#icon-book-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-redenvelope-fill"></use>
                </svg>
                <div class="name">red envelope-fill</div>
                <div class="code-name">#icon-redenvelope-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-safetycertificate-f"></use>
                </svg>
                <div class="name">safety certificate-f</div>
                <div class="code-name">#icon-safetycertificate-f</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-propertysafety-fill"></use>
                </svg>
                <div class="name">property safety-fill</div>
                <div class="code-name">#icon-propertysafety-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-insurance-fill"></use>
                </svg>
                <div class="name">insurance-fill</div>
                <div class="code-name">#icon-insurance-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-securityscan-fill"></use>
                </svg>
                <div class="name">security scan-fill</div>
                <div class="code-name">#icon-securityscan-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-exclamation-fil"></use>
                </svg>
                <div class="name">file-exclamation-fil</div>
                <div class="code-name">#icon-file-exclamation-fil</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-add-fill"></use>
                </svg>
                <div class="name">file-add-fill</div>
                <div class="code-name">#icon-file-add-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-fill"></use>
                </svg>
                <div class="name">file-fill</div>
                <div class="code-name">#icon-file-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-excel-fill"></use>
                </svg>
                <div class="name">file-excel-fill</div>
                <div class="code-name">#icon-file-excel-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-markdown-fill"></use>
                </svg>
                <div class="name">file-markdown-fill</div>
                <div class="code-name">#icon-file-markdown-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-text-fill"></use>
                </svg>
                <div class="name">file-text-fill</div>
                <div class="code-name">#icon-file-text-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-ppt-fill"></use>
                </svg>
                <div class="name">file-ppt-fill</div>
                <div class="code-name">#icon-file-ppt-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-unknown-fill"></use>
                </svg>
                <div class="name">file-unknown-fill</div>
                <div class="code-name">#icon-file-unknown-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-word-fill"></use>
                </svg>
                <div class="name">file-word-fill</div>
                <div class="code-name">#icon-file-word-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-zip-fill"></use>
                </svg>
                <div class="name">file-zip-fill</div>
                <div class="code-name">#icon-file-zip-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-pdf-fill"></use>
                </svg>
                <div class="name">file-pdf-fill</div>
                <div class="code-name">#icon-file-pdf-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-image-fill"></use>
                </svg>
                <div class="name">file-image-fill</div>
                <div class="code-name">#icon-file-image-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-diff-fill"></use>
                </svg>
                <div class="name">diff-fill</div>
                <div class="code-name">#icon-diff-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-file-copy-fill"></use>
                </svg>
                <div class="name">file-copy-fill</div>
                <div class="code-name">#icon-file-copy-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-snippets-fill"></use>
                </svg>
                <div class="name">snippets-fill</div>
                <div class="code-name">#icon-snippets-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-batchfolding-fill"></use>
                </svg>
                <div class="name">batch folding-fill</div>
                <div class="code-name">#icon-batchfolding-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reconciliation-fill"></use>
                </svg>
                <div class="name">reconciliation-fill</div>
                <div class="code-name">#icon-reconciliation-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-folder-add-fill"></use>
                </svg>
                <div class="name">folder-add-fill</div>
                <div class="code-name">#icon-folder-add-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-folder-fill"></use>
                </svg>
                <div class="name">folder-fill</div>
                <div class="code-name">#icon-folder-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-folder-open-fill"></use>
                </svg>
                <div class="name">folder-open-fill</div>
                <div class="code-name">#icon-folder-open-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-database-fill"></use>
                </svg>
                <div class="name">database-fill</div>
                <div class="code-name">#icon-database-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-container-fill"></use>
                </svg>
                <div class="name">container-fill</div>
                <div class="code-name">#icon-container-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sever-fill"></use>
                </svg>
                <div class="name">sever-fill</div>
                <div class="code-name">#icon-sever-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calendar-check-fill"></use>
                </svg>
                <div class="name">calendar-check-fill</div>
                <div class="code-name">#icon-calendar-check-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-image-fill"></use>
                </svg>
                <div class="name">image-fill</div>
                <div class="code-name">#icon-image-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-idcard-fill"></use>
                </svg>
                <div class="name">id card-fill</div>
                <div class="code-name">#icon-idcard-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-creditcard-fill"></use>
                </svg>
                <div class="name">credit card-fill</div>
                <div class="code-name">#icon-creditcard-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fund-fill"></use>
                </svg>
                <div class="name">fund-fill</div>
                <div class="code-name">#icon-fund-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-read-fill"></use>
                </svg>
                <div class="name">read-fill</div>
                <div class="code-name">#icon-read-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-contacts-fill"></use>
                </svg>
                <div class="name">contacts-fill</div>
                <div class="code-name">#icon-contacts-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-delete-fill"></use>
                </svg>
                <div class="name">delete-fill</div>
                <div class="code-name">#icon-delete-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-notification-fill"></use>
                </svg>
                <div class="name">notification-fill</div>
                <div class="code-name">#icon-notification-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-flag-fill"></use>
                </svg>
                <div class="name">flag-fill</div>
                <div class="code-name">#icon-flag-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-moneycollect-fill"></use>
                </svg>
                <div class="name">money collect-fill</div>
                <div class="code-name">#icon-moneycollect-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-medicinebox-fill"></use>
                </svg>
                <div class="name">medicine box-fill</div>
                <div class="code-name">#icon-medicinebox-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rest-fill"></use>
                </svg>
                <div class="name">rest-fill</div>
                <div class="code-name">#icon-rest-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shopping-fill"></use>
                </svg>
                <div class="name">shopping-fill</div>
                <div class="code-name">#icon-shopping-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-skin-fill"></use>
                </svg>
                <div class="name">skin-fill</div>
                <div class="code-name">#icon-skin-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-video-fill"></use>
                </svg>
                <div class="name">video-fill</div>
                <div class="code-name">#icon-video-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sound-fill"></use>
                </svg>
                <div class="name">sound-fill</div>
                <div class="code-name">#icon-sound-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bulb-fill"></use>
                </svg>
                <div class="name">bulb-fill</div>
                <div class="code-name">#icon-bulb-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bell-fill"></use>
                </svg>
                <div class="name">bell-fill</div>
                <div class="code-name">#icon-bell-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-filter-fill"></use>
                </svg>
                <div class="name">filter-fill</div>
                <div class="code-name">#icon-filter-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fire-fill"></use>
                </svg>
                <div class="name">fire-fill</div>
                <div class="code-name">#icon-fire-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-funnelplot-fill"></use>
                </svg>
                <div class="name">funnel plot-fill</div>
                <div class="code-name">#icon-funnelplot-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gift-fill"></use>
                </svg>
                <div class="name">gift-fill</div>
                <div class="code-name">#icon-gift-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-hourglass-fill"></use>
                </svg>
                <div class="name">hourglass-fill</div>
                <div class="code-name">#icon-hourglass-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-home-fill"></use>
                </svg>
                <div class="name">home-fill</div>
                <div class="code-name">#icon-home-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-trophy-fill"></use>
                </svg>
                <div class="name">trophy-fill</div>
                <div class="code-name">#icon-trophy-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-location-fill"></use>
                </svg>
                <div class="name">location-fill</div>
                <div class="code-name">#icon-location-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cloud-fill"></use>
                </svg>
                <div class="name">cloud-fill</div>
                <div class="code-name">#icon-cloud-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-customerservice-fill"></use>
                </svg>
                <div class="name">customerservice-fill</div>
                <div class="code-name">#icon-customerservice-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-experiment-fill"></use>
                </svg>
                <div class="name">experiment-fill</div>
                <div class="code-name">#icon-experiment-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-eye-fill"></use>
                </svg>
                <div class="name">eye-fill</div>
                <div class="code-name">#icon-eye-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-like-fill"></use>
                </svg>
                <div class="name">like-fill</div>
                <div class="code-name">#icon-like-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lock-fill"></use>
                </svg>
                <div class="name">lock-fill</div>
                <div class="code-name">#icon-lock-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-unlike-fill"></use>
                </svg>
                <div class="name">unlike-fill</div>
                <div class="code-name">#icon-unlike-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-star-fill"></use>
                </svg>
                <div class="name">star-fill</div>
                <div class="code-name">#icon-star-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-unlock-fill"></use>
                </svg>
                <div class="name">unlock-fill</div>
                <div class="code-name">#icon-unlock-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alert-fill"></use>
                </svg>
                <div class="name">alert-fill</div>
                <div class="code-name">#icon-alert-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-api-fill"></use>
                </svg>
                <div class="name">api-fill</div>
                <div class="code-name">#icon-api-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-highlight-fill"></use>
                </svg>
                <div class="name">highlight-fill</div>
                <div class="code-name">#icon-highlight-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-phone-fill"></use>
                </svg>
                <div class="name">phone-fill</div>
                <div class="code-name">#icon-phone-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-edit-fill"></use>
                </svg>
                <div class="name">edit-fill</div>
                <div class="code-name">#icon-edit-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pushpin-fill"></use>
                </svg>
                <div class="name">pushpin-fill</div>
                <div class="code-name">#icon-pushpin-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rocket-fill"></use>
                </svg>
                <div class="name">rocket-fill</div>
                <div class="code-name">#icon-rocket-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-thunderbolt-fill"></use>
                </svg>
                <div class="name">thunderbolt-fill</div>
                <div class="code-name">#icon-thunderbolt-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tag-fill"></use>
                </svg>
                <div class="name">tag-fill</div>
                <div class="code-name">#icon-tag-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wrench-fill"></use>
                </svg>
                <div class="name">wrench-fill</div>
                <div class="code-name">#icon-wrench-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tags-fill"></use>
                </svg>
                <div class="name">tags-fill</div>
                <div class="code-name">#icon-tags-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bank-fill"></use>
                </svg>
                <div class="name">bank-fill</div>
                <div class="code-name">#icon-bank-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-camera-fill"></use>
                </svg>
                <div class="name">camera-fill</div>
                <div class="code-name">#icon-camera-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-error-fill"></use>
                </svg>
                <div class="name">error-fill</div>
                <div class="code-name">#icon-error-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-crown-fill"></use>
                </svg>
                <div class="name">crown-fill</div>
                <div class="code-name">#icon-crown-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mail-fill"></use>
                </svg>
                <div class="name">mail-fill</div>
                <div class="code-name">#icon-mail-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-car-fill"></use>
                </svg>
                <div class="name">car-fill</div>
                <div class="code-name">#icon-car-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-printer-fill"></use>
                </svg>
                <div class="name">printer-fill</div>
                <div class="code-name">#icon-printer-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shop-fill"></use>
                </svg>
                <div class="name">shop-fill</div>
                <div class="code-name">#icon-shop-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-setting-fill"></use>
                </svg>
                <div class="name">setting-fill</div>
                <div class="code-name">#icon-setting-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-USB-fill"></use>
                </svg>
                <div class="name">USB-fill</div>
                <div class="code-name">#icon-USB-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-golden-fill"></use>
                </svg>
                <div class="name">golden-fill</div>
                <div class="code-name">#icon-golden-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-build-fill"></use>
                </svg>
                <div class="name">build-fill</div>
                <div class="code-name">#icon-build-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-boxplot-fill"></use>
                </svg>
                <div class="name">box plot-fill</div>
                <div class="code-name">#icon-boxplot-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sliders-fill"></use>
                </svg>
                <div class="name">sliders-fill</div>
                <div class="code-name">#icon-sliders-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alibaba"></use>
                </svg>
                <div class="name">alibaba</div>
                <div class="code-name">#icon-alibaba</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alibabacloud"></use>
                </svg>
                <div class="name">alibabacloud</div>
                <div class="code-name">#icon-alibabacloud</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-antdesign"></use>
                </svg>
                <div class="name">ant design</div>
                <div class="code-name">#icon-antdesign</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ant-cloud"></use>
                </svg>
                <div class="name">ant-cloud</div>
                <div class="code-name">#icon-ant-cloud</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-behance"></use>
                </svg>
                <div class="name">behance</div>
                <div class="code-name">#icon-behance</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-googleplus"></use>
                </svg>
                <div class="name">google plus</div>
                <div class="code-name">#icon-googleplus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-medium"></use>
                </svg>
                <div class="name">medium</div>
                <div class="code-name">#icon-medium</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-google"></use>
                </svg>
                <div class="name">google</div>
                <div class="code-name">#icon-google</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-IE"></use>
                </svg>
                <div class="name">IE</div>
                <div class="code-name">#icon-IE</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-amazon"></use>
                </svg>
                <div class="name">amazon</div>
                <div class="code-name">#icon-amazon</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-slack"></use>
                </svg>
                <div class="name">slack</div>
                <div class="code-name">#icon-slack</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alipay"></use>
                </svg>
                <div class="name">alipay</div>
                <div class="code-name">#icon-alipay</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-taobao"></use>
                </svg>
                <div class="name">taobao</div>
                <div class="code-name">#icon-taobao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhihu"></use>
                </svg>
                <div class="name">zhihu</div>
                <div class="code-name">#icon-zhihu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-HTML"></use>
                </svg>
                <div class="name">HTML5</div>
                <div class="code-name">#icon-HTML</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-linkedin"></use>
                </svg>
                <div class="name">linkedin</div>
                <div class="code-name">#icon-linkedin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yahoo"></use>
                </svg>
                <div class="name">yahoo</div>
                <div class="code-name">#icon-yahoo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-facebook"></use>
                </svg>
                <div class="name">facebook</div>
                <div class="code-name">#icon-facebook</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-skype"></use>
                </svg>
                <div class="name">skype</div>
                <div class="code-name">#icon-skype</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-CodeSandbox"></use>
                </svg>
                <div class="name">CodeSandbox</div>
                <div class="code-name">#icon-CodeSandbox</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chrome"></use>
                </svg>
                <div class="name">chrome</div>
                <div class="code-name">#icon-chrome</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-codepen"></use>
                </svg>
                <div class="name">codepen</div>
                <div class="code-name">#icon-codepen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-aliwangwang"></use>
                </svg>
                <div class="name">aliwangwang</div>
                <div class="code-name">#icon-aliwangwang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-apple"></use>
                </svg>
                <div class="name">apple</div>
                <div class="code-name">#icon-apple</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-android"></use>
                </svg>
                <div class="name">android</div>
                <div class="code-name">#icon-android</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sketch"></use>
                </svg>
                <div class="name">sketch</div>
                <div class="code-name">#icon-sketch</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Gitlab"></use>
                </svg>
                <div class="name">Gitlab</div>
                <div class="code-name">#icon-Gitlab</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dribbble"></use>
                </svg>
                <div class="name">dribbble</div>
                <div class="code-name">#icon-dribbble</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-instagram"></use>
                </svg>
                <div class="name">instagram</div>
                <div class="code-name">#icon-instagram</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reddit"></use>
                </svg>
                <div class="name">reddit</div>
                <div class="code-name">#icon-reddit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-windows"></use>
                </svg>
                <div class="name">windows</div>
                <div class="code-name">#icon-windows</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yuque"></use>
                </svg>
                <div class="name">yuque</div>
                <div class="code-name">#icon-yuque</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Youtube"></use>
                </svg>
                <div class="name">Youtube</div>
                <div class="code-name">#icon-Youtube</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Gitlab-fill"></use>
                </svg>
                <div class="name">Gitlab-fill</div>
                <div class="code-name">#icon-Gitlab-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dropbox"></use>
                </svg>
                <div class="name">dropbox</div>
                <div class="code-name">#icon-dropbox</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dingtalk"></use>
                </svg>
                <div class="name">dingtalk</div>
                <div class="code-name">#icon-dingtalk</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-android-fill"></use>
                </svg>
                <div class="name">android-fill</div>
                <div class="code-name">#icon-android-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-apple-fill"></use>
                </svg>
                <div class="name">apple-fill</div>
                <div class="code-name">#icon-apple-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-HTML-fill"></use>
                </svg>
                <div class="name">HTML5-fill</div>
                <div class="code-name">#icon-HTML-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-windows-fill"></use>
                </svg>
                <div class="name">windows-fill</div>
                <div class="code-name">#icon-windows-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-QQ"></use>
                </svg>
                <div class="name">QQ</div>
                <div class="code-name">#icon-QQ</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-twitter"></use>
                </svg>
                <div class="name">twitter</div>
                <div class="code-name">#icon-twitter</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-skype-fill"></use>
                </svg>
                <div class="name">skype-fill</div>
                <div class="code-name">#icon-skype-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-weibo"></use>
                </svg>
                <div class="name">weibo</div>
                <div class="code-name">#icon-weibo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yuque-fill"></use>
                </svg>
                <div class="name">yuque-fill</div>
                <div class="code-name">#icon-yuque-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Youtube-fill"></use>
                </svg>
                <div class="name">Youtube-fill</div>
                <div class="code-name">#icon-Youtube-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yahoo-fill"></use>
                </svg>
                <div class="name">yahoo-fill</div>
                <div class="code-name">#icon-yahoo-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wechat-fill"></use>
                </svg>
                <div class="name">wechat-fill</div>
                <div class="code-name">#icon-wechat-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chrome-fill"></use>
                </svg>
                <div class="name">chrome-fill</div>
                <div class="code-name">#icon-chrome-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alipay-circle-fill"></use>
                </svg>
                <div class="name">alipay-circle-fill</div>
                <div class="code-name">#icon-alipay-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-aliwangwang-fill"></use>
                </svg>
                <div class="name">aliwangwang-fill</div>
                <div class="code-name">#icon-aliwangwang-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-behance-circle-fill"></use>
                </svg>
                <div class="name">behance-circle-fill</div>
                <div class="code-name">#icon-behance-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-amazon-circle-fill"></use>
                </svg>
                <div class="name">amazon-circle-fill</div>
                <div class="code-name">#icon-amazon-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-codepen-circle-fill"></use>
                </svg>
                <div class="name">codepen-circle-fill</div>
                <div class="code-name">#icon-codepen-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-CodeSandbox-circle-f"></use>
                </svg>
                <div class="name">CodeSandbox-circle-f</div>
                <div class="code-name">#icon-CodeSandbox-circle-f</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dropbox-circle-fill"></use>
                </svg>
                <div class="name">dropbox-circle-fill</div>
                <div class="code-name">#icon-dropbox-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-github-fill"></use>
                </svg>
                <div class="name">github-fill</div>
                <div class="code-name">#icon-github-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dribbble-circle-fill"></use>
                </svg>
                <div class="name">dribbble-circle-fill</div>
                <div class="code-name">#icon-dribbble-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-googleplus-circle-f"></use>
                </svg>
                <div class="name">google plus-circle-f</div>
                <div class="code-name">#icon-googleplus-circle-f</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-medium-circle-fill"></use>
                </svg>
                <div class="name">medium-circle-fill</div>
                <div class="code-name">#icon-medium-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-QQ-circle-fill"></use>
                </svg>
                <div class="name">QQ-circle-fill</div>
                <div class="code-name">#icon-QQ-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-IE-circle-fill"></use>
                </svg>
                <div class="name">IE-circle-fill</div>
                <div class="code-name">#icon-IE-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-google-circle-fill"></use>
                </svg>
                <div class="name">google-circle-fill</div>
                <div class="code-name">#icon-google-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dingtalk-circle-fill"></use>
                </svg>
                <div class="name">dingtalk-circle-fill</div>
                <div class="code-name">#icon-dingtalk-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sketch-circle-fill"></use>
                </svg>
                <div class="name">sketch-circle-fill</div>
                <div class="code-name">#icon-sketch-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-slack-circle-fill"></use>
                </svg>
                <div class="name">slack-circle-fill</div>
                <div class="code-name">#icon-slack-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-twitter-circle-fill"></use>
                </svg>
                <div class="name">twitter-circle-fill</div>
                <div class="code-name">#icon-twitter-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-taobao-circle-fill"></use>
                </svg>
                <div class="name">taobao-circle-fill</div>
                <div class="code-name">#icon-taobao-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-weibo-circle-fill"></use>
                </svg>
                <div class="name">weibo-circle-fill</div>
                <div class="code-name">#icon-weibo-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhihu-circle-fill"></use>
                </svg>
                <div class="name">zhihu-circle-fill</div>
                <div class="code-name">#icon-zhihu-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reddit-circle-fill"></use>
                </svg>
                <div class="name">reddit-circle-fill</div>
                <div class="code-name">#icon-reddit-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-alipay-square-fill"></use>
                </svg>
                <div class="name">alipay-square-fill</div>
                <div class="code-name">#icon-alipay-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dingtalk-square-fill"></use>
                </svg>
                <div class="name">dingtalk-square-fill</div>
                <div class="code-name">#icon-dingtalk-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-CodeSandbox-square-f"></use>
                </svg>
                <div class="name">CodeSandbox-square-f</div>
                <div class="code-name">#icon-CodeSandbox-square-f</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-behance-square-fill"></use>
                </svg>
                <div class="name">behance-square-fill</div>
                <div class="code-name">#icon-behance-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-amazon-square-fill"></use>
                </svg>
                <div class="name">amazon-square-fill</div>
                <div class="code-name">#icon-amazon-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-codepen-square-fill"></use>
                </svg>
                <div class="name">codepen-square-fill</div>
                <div class="code-name">#icon-codepen-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dribbble-square-fill"></use>
                </svg>
                <div class="name">dribbble-square-fill</div>
                <div class="code-name">#icon-dribbble-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dropbox-square-fill"></use>
                </svg>
                <div class="name">dropbox-square-fill</div>
                <div class="code-name">#icon-dropbox-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-facebook-fill"></use>
                </svg>
                <div class="name">facebook-fill</div>
                <div class="code-name">#icon-facebook-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-googleplus-square-f"></use>
                </svg>
                <div class="name">google plus-square-f</div>
                <div class="code-name">#icon-googleplus-square-f</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-google-square-fill"></use>
                </svg>
                <div class="name">google-square-fill</div>
                <div class="code-name">#icon-google-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-instagram-fill"></use>
                </svg>
                <div class="name">instagram-fill</div>
                <div class="code-name">#icon-instagram-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-IE-square-fill"></use>
                </svg>
                <div class="name">IE-square-fill</div>
                <div class="code-name">#icon-IE-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-medium-square-fill"></use>
                </svg>
                <div class="name">medium-square-fill</div>
                <div class="code-name">#icon-medium-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-linkedin-fill"></use>
                </svg>
                <div class="name">linkedin-fill</div>
                <div class="code-name">#icon-linkedin-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-QQ-square-fill"></use>
                </svg>
                <div class="name">QQ-square-fill</div>
                <div class="code-name">#icon-QQ-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-reddit-square-fill"></use>
                </svg>
                <div class="name">reddit-square-fill</div>
                <div class="code-name">#icon-reddit-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-twitter-square-fill"></use>
                </svg>
                <div class="name">twitter-square-fill</div>
                <div class="code-name">#icon-twitter-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sketch-square-fill"></use>
                </svg>
                <div class="name">sketch-square-fill</div>
                <div class="code-name">#icon-sketch-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-slack-square-fill"></use>
                </svg>
                <div class="name">slack-square-fill</div>
                <div class="code-name">#icon-slack-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-taobao-square-fill"></use>
                </svg>
                <div class="name">taobao-square-fill</div>
                <div class="code-name">#icon-taobao-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-weibo-square-fill"></use>
                </svg>
                <div class="name">weibo-square-fill</div>
                <div class="code-name">#icon-weibo-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhihu-square-fill"></use>
                </svg>
                <div class="name">zhihu-square-fill</div>
                <div class="code-name">#icon-zhihu-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zoomout"></use>
                </svg>
                <div class="name">zoom out</div>
                <div class="code-name">#icon-zoomout</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-apartment"></use>
                </svg>
                <div class="name">apartment</div>
                <div class="code-name">#icon-apartment</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-audio"></use>
                </svg>
                <div class="name">audio</div>
                <div class="code-name">#icon-audio</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-audio-fill"></use>
                </svg>
                <div class="name">audio-fill</div>
                <div class="code-name">#icon-audio-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-robot"></use>
                </svg>
                <div class="name">robot</div>
                <div class="code-name">#icon-robot</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zoomin"></use>
                </svg>
                <div class="name">zoom in</div>
                <div class="code-name">#icon-zoomin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-robot-fill"></use>
                </svg>
                <div class="name">robot-fill</div>
                <div class="code-name">#icon-robot-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bug-fill"></use>
                </svg>
                <div class="name">bug-fill</div>
                <div class="code-name">#icon-bug-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bug"></use>
                </svg>
                <div class="name">bug</div>
                <div class="code-name">#icon-bug</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-audiostatic"></use>
                </svg>
                <div class="name">audio static</div>
                <div class="code-name">#icon-audiostatic</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-comment"></use>
                </svg>
                <div class="name">comment</div>
                <div class="code-name">#icon-comment</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-signal-fill"></use>
                </svg>
                <div class="name">signal-fill</div>
                <div class="code-name">#icon-signal-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-verified"></use>
                </svg>
                <div class="name">verified</div>
                <div class="code-name">#icon-verified</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shortcut-fill"></use>
                </svg>
                <div class="name">shortcut-fill</div>
                <div class="code-name">#icon-shortcut-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-videocameraadd"></use>
                </svg>
                <div class="name">videocamera add</div>
                <div class="code-name">#icon-videocameraadd</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-switchuser"></use>
                </svg>
                <div class="name">switch user</div>
                <div class="code-name">#icon-switchuser</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-whatsapp"></use>
                </svg>
                <div class="name">whatsapp</div>
                <div class="code-name">#icon-whatsapp</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-appstoreadd"></use>
                </svg>
                <div class="name">appstore add</div>
                <div class="code-name">#icon-appstoreadd</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caret-down"></use>
                </svg>
                <div class="name">caret-down</div>
                <div class="code-name">#icon-caret-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-backward"></use>
                </svg>
                <div class="name">backward</div>
                <div class="code-name">#icon-backward</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caret-up"></use>
                </svg>
                <div class="name">caret-up</div>
                <div class="code-name">#icon-caret-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caret-right"></use>
                </svg>
                <div class="name">caret-right</div>
                <div class="code-name">#icon-caret-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caret-left"></use>
                </svg>
                <div class="name">caret-left</div>
                <div class="code-name">#icon-caret-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fast-backward"></use>
                </svg>
                <div class="name">fast-backward</div>
                <div class="code-name">#icon-fast-backward</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-forward"></use>
                </svg>
                <div class="name">forward</div>
                <div class="code-name">#icon-forward</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fast-forward"></use>
                </svg>
                <div class="name">fast-forward</div>
                <div class="code-name">#icon-fast-forward</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-search"></use>
                </svg>
                <div class="name">search</div>
                <div class="code-name">#icon-search</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-retweet"></use>
                </svg>
                <div class="name">retweet</div>
                <div class="code-name">#icon-retweet</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-login"></use>
                </svg>
                <div class="name">login</div>
                <div class="code-name">#icon-login</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-step-backward"></use>
                </svg>
                <div class="name">step-backward</div>
                <div class="code-name">#icon-step-backward</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-step-forward"></use>
                </svg>
                <div class="name">step-forward</div>
                <div class="code-name">#icon-step-forward</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-swap-right"></use>
                </svg>
                <div class="name">swap-right</div>
                <div class="code-name">#icon-swap-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-swap-left"></use>
                </svg>
                <div class="name">swap-left</div>
                <div class="code-name">#icon-swap-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-woman"></use>
                </svg>
                <div class="name">woman</div>
                <div class="code-name">#icon-woman</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
